Papierkorb » Mein Seitenmenü

<style>
    /* Anfang Hier beginnt der CSS - Code */
 
    /* Anfang Hier beginnt das Seitenmenü */
    :root {
        --side-background: linear-gradient(to bottom, #959595 0%, #0d0d0d 46%, #010101 50%, #0a0a0a 53%, #4e4e4e 76%, #383838 87%, #1b1b1b 100%);
    }
 
    body {
        margin-left: 50px;
    }
    .side_page {
        position: fixed;
        top: 0;
        left: 0;
        height: 100%;
        width: 300px;
        background: var(--side-background);
        z-index: 100;
        transition: all 0.5s ease;
        font-size: 1.025rem;
        font-family: "arial", sans-serif;
        z-index: 999999;
    }
    .side_page.close {
        width: 78px;
    }
    .side_page .logo-details {
        height: 60px;
        width: 100%;
        display: flex;
        align-items: center;
        cursor: pointer;
    }
    .side_page .logo-details i {
        font-size: 30px;
        color: #fff;
        height: 50px;
        min-width: 78px;
        text-align: center;
        line-height: 50px;
    }
    .side_page .logo-details .logo_name {
        font-size: 22px;
        color: #fff;
        font-weight: 600;
        transition: 0.3s ease;
        transition-delay: 0.1s;
    }
    .side_page.close .logo-details .logo_name {
        transition-delay: 0s;
        opacity: 0;
        pointer-events: none;
    }
    .side_page .nav-links {
        height: 100%;
        padding: 0 0 150px 0;
        overflow: auto;
    }
    .side_page.close .nav-links {
        overflow: visible;
    }
    .side_page .nav-links::-webkit-scrollbar {
        display: none;
    }
    .side_page .nav-links li {
        position: relative;
        list-style: none;
        transition: all 0.4s ease;
    }
    .side_page .nav-links li:hover {
        background: var(--side-background);
    }
    .side_page .nav-links li .icon-link {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    .side_page.close .nav-links li .icon-link {
        display: block;
    }
    .side_page .nav-links li i {
        height: 50px;
        min-width: 78px;
        text-align: center;
        line-height: 50px;
        color: #fff;
        font-size: 20px;
        cursor: pointer;
        transition: all 0.3s ease;
    }
    .side_page .nav-links li.showMenu i.arrow {
        transform: rotate(-180deg);
    }
    .side_page.close .nav-links i.arrow {
        display: none;
    }
    .side_page .nav-links li a {
        display: flex;
        align-items: center;
        text-decoration: none;
    }
    .side_page .nav-links li a .link_name {
        font-size: 18px;
        font-weight: 400;
        color: #fff;
        transition: all 0.4s ease;
    }
    .side_page.close .nav-links li a .link_name {
        opacity: 0;
        pointer-events: none;
    }
    .side_page .nav-links li .sub-menu {
        padding: 3px 6px 6px 45px;
        padding: 5px 10px;
        mmin-width: 250px;
        margin-top: -10px;
        background: var(--side-background);
        display: none;
        color: #fff;
    }
    .side_page .nav-links li.showMenu .sub-menu {
        display: block;
    }
    .side_page .nav-links li .sub-menu a {
        color: #fff;
        font-size: 15px;
        padding: 5px;
        white-space: nowrap;
        opacity: 0.6;
        transition: all 0.3s ease;
    }
    .side_page .nav-links li .sub-menu a:hover {
        opacity: 1;
    }
    .side_page.close .nav-links li .sub-menu {
        position: absolute;
        left: 100%;
        top: -10px;
        margin-top: 0;
        padding: 10px 20px;
        border-radius: 0 6px 6px 0;
        opacity: 0;
        display: block;
        pointer-events: none;
        transition: 0s;
    }
    .side_page.close .nav-links li:hover .sub-menu {
        top: 0;
        opacity: 1;
        pointer-events: auto;
        transition: all 0.4s ease;
    }
    .side_page .nav-links li .sub-menu .link_name {
        display: none;
    }
    .side_page.close .nav-links li .sub-menu .link_name {
        font-size: 18px;
        opacity: 1;
        display: block;
    }
    .side_page .nav-links li .sub-menu.blank {
        opacity: 1;
        pointer-events: auto;
        padding: 3px 20px 6px 16px;
        opacity: 0;
        pointer-events: none;
    }
    .side_page .nav-links li:hover .sub-menu.blank {
        top: 50%;
        transform: translateY(-50%);
    }
    .side_page .profile-details {
        position: fixed;
        bottom: 0;
        width: 280px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        background: var(--side-background);
        padding: 12px 0;
        transition: all 0.5s ease;
    }
    .side_page.close .profile-details {
        background: none;
    }
    .side_page.close .profile-details {
        width: 78px;
    }
    .side_page .profile-details .profile-content {
        display: flex;
        align-items: center;
    }
    .side_page .profile-details img {
        height: 42px;
        width: auto;
        object-fit: cover;
        border-radius: 16px;
        margin: 0 14px 0 2px;
        background: var(--side-background);
        transition: all 0.5s ease;
        box-shadow: 0px 0px 3px 1px #656565;
    }
    .side_page.close .profile-details img {
        padding: 10px;
    }
    .side_page .profile-details .profile_name,
    .side_page .profile-details .job {
        color: #000;
        font-size: 18px;
        font-weight: 500;
        white-space: nowrap;
    }
    .side_page.close .profile-details i,
    .side_page.close .profile-details .profile_name,
    .side_page.close .profile-details .job {
        display: none;
    }
    .side_page .profile-details .job {
        font-size: 12px;
    }
    .home-section {
        position: relative;
        background: #2a407d;
        height: 100vh;
        left: 260px;
        width: calc(100% - 280px);
        transition: all 0.5s ease;
    }
    .side_page.close ~ .home-section {
        left: 78px;
        width: calc(100% - 78px);
    }
    .home-section .home-content {
        height: 60px;
        display: flex;
        align-items: center;
    }
    .home-section .home-content .bx-menu,
    .home-section .home-content .text {
        color: #2c21b5;
        font-size: 35px;
    }
    .home-section .home-content .bx-menu {
        margin: 0 15px;
        cursor: pointer;
    }
    .home-section .home-content .text {
        font-size: 26px;
        font-weight: 600;
    }
    @media (max-width: 420px) {
        .side_page.close .nav-links li .sub-menu {
            display: none;
        }
    }
 
    .side_nav_link-img {
        left: 95px;
        position: fixed;
        width: 2%;
        height: auto;
        border-radius: 50%;
    }
 
    .nav__count {
        padding: 0.1rem 0.4rem;
        border-radius: 48%;
        background-color: red;
        font-size: small;
        color: white;
    }
 
    /* Ende Hier endet das Seitenmenü */
 
    /* Anfang Hier beginnt die Spende */
 
    .donation_progress .ppercent {
        max-width: 100%;
        height: 10px;
        background: #a9db80;
        background: -moz-linear-gradient(top, #a9db80 0%, #96c56f 100%);
        background: -webkit-linear-gradient(top, #a9db80 0%, #96c56f 100%);
        background: linear-gradient(to bottom, #a9db80 0%, #96c56f 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a9db80', endColorstr='#96c56f',GradientType=0 );
        position: absolute;
        top: 0px;
        left: 0px;
        padding: 10px 0;
        max-width: 100% !important;
    }
    .donation_progress .peuro {
        height: 10px;
        position: absolute;
        display: block;
        width: 100%;
        z-index: 2;
    }
    .donation_progress {
        border: 1px solid;
        padding: 10px;
        text-align: center;
        position: relative;
        max-width: 500px;
        height: 10px;
    }
    span[title] {
        text-decoration: underline;
    }
 
    /* Ende Hier endet die Spende */
 
    /* Anfang Hier beginnt der Kalender im Seitenmenü */
 
    * {
        padding: 0px;
        margin: 0px;
    }
 
    .container-crew {
        display: flex;
        flex-direction: column;
        color: #222222;
        align-items: center;
        justify-content: center;
        height: auto;
        margin: 0 auto;
    }
    .main-crew {
        position: relative;
        border: 1px solid #797979;
        width: var(--GroesseKalender);
        border-radius: calc(var(--GroesseKalender) / 12);
        padding: 0;
        box-shadow: 0px 0px 13px 3px #777777;
        margin: calc(var(--GroesseKalender) / 6) auto;
        background: #e0dcdc;
        color: #222222;
    }
    .main-crew #date2 {
        font: calc(var(--GroesseKalender) / 2) Arial, sans-serif;
        letter-spacing: 1px;
        margin-right: auto;
        margin-left: auto;
        margin-top: calc(var(--GroesseKalender) / 16);
        margin-bottom: calc(var(--GroesseKalender) / 7.5);
        padding: 0;
    }
    .main-crew ul {
        display: flex;
        padding: 0;
        margin: 0;
    }
    .main-crew ul li {
        list-style-type: circle;
        list-style-position: inside;
        width: calc(var(--GroesseKalender) / 12);
        height: calc(var(--GroesseKalender) / 3);
        border-radius: calc(var(--GroesseKalender) / 10);
        background-image: radial-gradient(white 30%, #000000e3 40%, #aca9a9ad 70%);
        margin-right: calc(var(--GroesseKalender) / 8);
        margin-left: calc(var(--GroesseKalender) / 8);
        display: block;
        position: relative;
        box-shadow: 0px 4px 3px 0px #000;
    }
    .main-crew .top-crew {
        position: absolute;
        top: calc(var(--GroesseKalender) / -5.3);
    }
    .main-crew .sub-crew {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
        border-radius: calc(var(--GroesseKalender) / 10) calc(var(--GroesseKalender) / 12) 0 0;
 
        background: #0bb6d9;
        color: #222222;
    }
    .main-crew .year-crew {
        font: calc(var(--GroesseKalender) / 6.5) Arial, sans-serif;
        letter-spacing: 1px;
        margin-top: calc(var(--GroesseKalender) / 7.5);
        padding: 6px 0;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .main-crew #year2 {
        font: calc(var(--GroesseKalender) / 9.3) Arial, sans-serif;
        letter-spacing: 1px;
    }
 
    .main-crew .date-crew {
        display: flex;
        flex-direction: column;
        align-items: center;
        position: relative;
    }
    .main-crew #day2 {
        padding: 10px;
        margin: 0;
        position: absolute;
        bottom: -5px;
        font: calc(var(--GroesseKalender) / 7.2) Arial, sans-serif;
        letter-spacing: 1px;
    }
 
    .main-crew {
        /* Groeße Kalender im Portal */
        --GroesseKalender: 55px;
    }
 
    /* Ende Hier endet der Kalender im Seitenmenü */
 
    /* Beginnt Hier endet Copyright */
 
    .cp-text {
        color: rgba(0, 0, 0, 0.7);
        text-shadow: 0 1px rgba(255, 255, 255, 0.1);
    }
 
    /* Ende Hier endet Copyright */
</style>
 
<!-- Ende Hier endet der CSS - Code  -->
 
<!-- Anfang Hier beginnt das Box-Symbol CSS  -->
 
<!-- Box-Symbol CSS   -->
<link href="https://unpkg.com/boxicons@2.0.7/css/boxicons.min.css" rel="stylesheet" />
<!-- Ende -->
 
<!-- Ende Hier endet das Box-Symbol CSS  -->
 
<!-- Anfang Hier beginnt der anfang javascript / HTML - Code für die Module für das Seitenmenü  -->
<script>
    $(".container").append(`
  <div class="side_page close">
    <div class="logo-details">
      <i class='bx bx-menu' title="Hier können sie das Seitenmenü öffnen und schließen!"></i>
      <span class="logo_name">Menü</span>
    </div>
                      
<ul class="nav-links">
                                              
                         
                      
 <!-- Anfang hier beginnt die Hier könnt ihr die Notiz-Liste Benutzen -->                      
     <li>
        <div class="icon-link">
        <i class='bx bx-desktop'></i>
        </a>
        <i class="bx bxs-chevron-down arrow" title="Notiz Liste mit neuen Features"></i>
        </div>
        <ul class="sub-menu" style="width:250px;">
        <center> Guten Tag {{user_registered==true.start}}{{user_name}}{{user_registered==true.else}}lieber Besucher{{user_registered==true.end}}!<br> <br> Hier könnt ihr die Notiz-Liste Benutzen </center><br>
        <center><li><a href="#" class="notesheader"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<img class="start_header" src="https://files.homepagemodules.de/b916726/a_55_b1afb99d.png" alt="" width="75" height="75" border="0" alt="Notiz-Liste"></span></a></center></li>
        </ul>
 </li>                      
 <!-- Ende hier endet die Hier könnt ihr die Notiz-Liste Benutzen -->  
                       
                       
<!-- Anfang hier beginnt Spende mit Hilfe einer kleinen Spende dazu beitragen -->                  
    <li>
        <div class="icon-link">
        <i class='bx bxl-paypal'></i>
        </a>
        <i class="bx bxs-chevron-down arrow" title="Menü öffnen"></i>
        </div>
        <ul class="sub-menu" style="width:250px;">
        <center> Guten Tag {{user_registered==true.start}}{{user_name}}{{user_registered==true.else}}lieber Besucher{{user_registered==true.end}}!</center><br>
        <center><img height="auto" src="//files.homepagemodules.de/b906480/a_244_6356fb8f.png"></a></center>
        <center>Wenn Du uns dabei unterstützen möchtest, kannst Du mit Hilfe einer kleinen Spende dazu beitragen.
        Deine Spende hilft! <br><br>
        {{donation_goal==true.start}}
		<div class="donation_goal">Spendenziel: {{donation_goal}} &#128;</div>
		<div class="donation_progress"><span class="peuro"title="Hier sehen Sie den fortschritt des Spendenziels! Besten Dank!">{{donation_goal_percent}} %</span><div class="ppercent" style="width:{{donation_goal_percent}}%">&nbsp;</div></div>
		{{donation_goal==true.end}}</center><br>
       <center><a href="/donations.html" title="Wir hoffen, dass Dir unser Forum gefällt und freuen uns, dass Du Dich dazu entschlossen hast, uns zu unterstützen! Besten Dank! ">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<img height="auto" src="//files.homepagemodules.de/b906480/a_259_e0206fd8.png"></a></center> <br>  <br>
      </ul>
 </li> 
<!-- Ende hier endet Spende mit Hilfe einer kleinen Spende dazu beitragen -->                    
                       
<!-- Anfang hier beginnt der Forum Übersicht / Forum Link - Seiten -->              
    <li>
        <div class="icon-link">
        <i class='bx bx-home'></i>
        </a>
        <i class="bx bxs-chevron-down arrow" title="Forum Link - Seiten"></i>
        </div>
        <ul class="sub-menu" style="width:250px;">
        <center> Guten Tag {{user_registered==true.start}}{{user_name}}{{user_registered==true.else}}lieber Besucher{{user_registered==true.end}}!<br> <br> Hier könnt ihr Zu Forum Übersicht und zu den Links im Forum gelangen </center><br>
        <li><a href="./portal.php"><i class='bx bx-home'></i>Portal</a></li>
        <li><a href="./forum.php"><i class='bx bx-shape-polygon'></i>Forum Übersicht</a></li>
        <li><a href="./calendar.php"><i class='bx bx-calendar'></i>Kalender</a></li>
        <li><a href="./gallery.php"><i class='bx bx-photo-album'></i>Bildergalerie</a></li>
        <li><a href="#"><i class='bx bx-radio'></i>Online Radio</a></li>
	    <li><a href="#"><i class='bx bx-bookmark'></i>?</a></li>
 
      </ul>
 </li> 
<!-- Ende hier endet der Forum Übersicht / Forum Link - Seiten  -->
             
<!-- Anfang hier beginnt die Hilfe (FAQ) -->                
      <li>
      <div class="icon-link">
      <a href="./faq.php" title="">
      <i class="bx bx-help-circle"></i>
      <span class="link_name">Hilfe (FAQ)</span>
      </a>
      <i class="bx bxs-chevron-down arrow" title="Menü öffnen"></i>
      </div>
      <ul class="sub-menu" style="width:250px;"> 
      <center> Guten Tag {{user_registered==true.start}}{{user_name}}{{user_registered==true.else}}lieber Besucher{{user_registered==true.end}}! <br> <br>Hier werden Frage zum Forum in der FAQ beantwortet </center><br>
      <li><a class="link_name" href="./faq.php" title="Hier werden Frage zum Forum beantwortet">Hilfe (FAQ)</a></li>
      </ul>
</li>
<!-- Ende hier endet die Hilfe (FAQ) --> 
	  
<!-- Anfang hier beginnt die Hier können sie sich registrieren, einloggen, sowie ausloggen --> 
    <li>
    <div class="icon-link">
    <i class='bx bx-log-in-circle'></i>
    <span class="link_name"></span>
    </a>
    <i class="bx bxs-chevron-down arrow" title="Menü öffnen"></i>
    </div>
    <ul class="sub-menu" style="width:250px;">
    <center> Guten Tag {{user_registered==true.start}}{{user_name}}{{user_registered==true.else}}lieber Besucher{{user_registered==true.end}}! <br> <br>Hier können sie sich registrieren, einloggen, sowie ausloggen</center><br>
    <span class="link_name"></span>
    <br>            
    <li><a href="./anmeldung.php"><i class='bx bx-key'></i>Registrieren</a></li>
    <li><a href="./login.php"><i class='bx bx-log-in'></i>Login</a></li>
    <a href="./login.php?option=logout"><i class='bx bx-log-out'></i>Logout</a></li>
    </ul>
</li>      
<!-- Ende hier endet die Hier können sie sich registrieren, einloggen, sowie ausloggen -->   
		
 
	
 <!-- Anfang hier beginnt die Forum - Der Treffpunkt für Hilfe, Tricks & Tipps --> 
      <li>
      <div class="icon-link">
      <i><center><img src="https://files.homepagemodules.de/b916726/a_49_76f38de3.png" alt="" width="38" height="18"></center></i>
      <span class="link_name"></span>
      </a>
      <i class="bx bxs-chevron-down arrow" title="Menü öffnen"></i>
      </div>
      <ul class="sub-menu" style="width:250px;">
      <center> Guten Tag {{user_registered==true.start}}{{user_name}}{{user_registered==true.else}}lieber Besucher{{user_registered==true.end}}! <br> <br>Hier sehen sie unseren Partner </center><br>
      <span class="link_name"> Der Treffpunkt für Hilfe, Tricks & Tipps</span>
      <br>
      <li><a href="https://www.hilfe-tricks-tipps.de/u1_Wolfgang.html" title="zum Profil"><img class="sside_nav_link-img" src="https://files.homepagemodules.de/b916726/a_50_d49435e1.gif" alt="" width="55" height="55">&nbsp;&nbsp;&nbsp;&nbsp;  &nbsp;&nbsp; &nbsp;&nbsp;  <span class="nav__count" title="Wolfgang!">Admin</span></a></li><br>
      <li><a href="https://www.hilfe-tricks-tipps.de/portal.html" target="_blank"><img src="https://files.homepagemodules.de/b916726/a_52_5034b677.png" alt="" width="15" height="15"> Portal Hilfe, Tricks & Tipps</a></li>
      <li><a href="https://www.hilfe-tricks-tipps.de/forum.php" target="_blank"><img src="https://files.homepagemodules.de/b916726/a_51_1e1131bc.png" alt="" width="15" height="15"> Forum Hilfe, Tricks & Tipps</a></li>
      <li><a href="https://www.hilfe-tricks-tipps.de/wiki:home" target="_blank"><img src="https://files.homepagemodules.de/b916726/a_51_1e1131bc.png" alt="" width="15" height="15"> Wiki Hilfe, Tricks & Tipps</a></li>
      </ul>
</li>
<!-- Ende hier endet die Forum - Der Treffpunkt für Hilfe, Tricks & Tipps -->
	
 
<!-- Anfang hier beginnt die Xobor Support, Portal, Wiki, Blog, Plugin --> 
      <li>
      <div class="icon-link">
      <i><center><img src="https://files.homepagemodules.de/b906480/a_251_3e7e5f9e.png" alt="" width="18" height="18"></center></i>
      <span class="link_name"></span>
      </a>
      <i class="bx bxs-chevron-down arrow" title="Menü öffnen"></i>
      </div>
      <ul class="sub-menu" style="width:250px;">
      <center> Guten Tag {{user_registered==true.start}}{{user_name}}{{user_registered==true.else}}lieber Besucher{{user_registered==true.end}}! <br> <br>Hier sehen sie Die professionelle Forum-Software von Xobor </center><br>
      <span class="link_name">Support & Hilfe für Xobor </span>
      <br>
      <li><a href="https://www.xobor.de/plugin-store.html" target="_blank"><img src="https://files.homepagemodules.de/b906480/a_251_3e7e5f9e.png" alt="" width="15" height="15"> Plugins &nbsp;&nbsp;&nbsp;&nbsp;  <span class="nav__count" title="Xobor Hat im moment 101 Plugins zur Verfügung!">101</span></a></li>
      <li><a href="https://www.hpm-support.de/" target="_blank"><img src="https://files.homepagemodules.de/b906480/a_251_3e7e5f9e.png" alt="" width="15" height="15"> Xobor Support</a></li>
      <li><a href="https://www.hpm-support.de/wiki:home" target="_blank"><img src="https://files.homepagemodules.de/b906480/a_251_3e7e5f9e.png" alt="" width="15" height="15"> Xobor Wiki</a></li>
      <li><a href="https://www.hpm-support.de/blog.html" target="_blank"><img src="https://files.homepagemodules.de/b906480/a_251_3e7e5f9e.png" alt="" width="15" height="15"> Xobor Blog </a></li>
      </ul>
</li>
<!-- Ende hier endet die Xobor Support, Portal, Wiki, Blog, Plugin -->
 
 <!-- Anfang hier beginnt das Online Radio -->                
      <li>
        <div class="icon-link">
          <a href="" title="">
            <i><center><img src="https://files.homepagemodules.de/b916726/a_53_bceed7d7.png" alt="" width="38" height="38"></center></i>
            <span class="link_name">Online Radio</span>
          </a>
          <i class="bx bxs-chevron-down arrow" title="Menü öffnen"></i>
        </div>
        <ul class="sub-menu" style="width:335px;"> 
       <center> Guten Tag {{user_registered==true.start}}{{user_name}}{{user_registered==true.else}}lieber Besucher{{user_registered==true.end}}! <br> <br>Hier können sie Online Radio Hören </center><br>
 
           <li><div class="ng-app-embedded"><div ui-view class="microsite embedded-radio-player" data-playerwidth="340px" data-playertype="web_embedded" data-playstation="hitradiortllausitz" data-autoplay="false" data-apikey="df04ff67dd3339a6fc19c9b8be164d5b5245ae93"></div></div><noscript><a href="https://www.radio.de/s/hitradiortllausitz" target="_blank">HITRADIO RTL Lausitz auf radio.de</a></noscript></li>          <br>
          <br>
		  <li><div class="ng-app-embedded"><div ui-view class="microsite embedded-radio-player" data-playerwidth="340px" data-playertype="web_embedded" data-playstation="bachatamix" data-autoplay="false" data-apikey="df04ff67dd3339a6fc19c9b8be164d5b5245ae93"></div></div><noscript><a href="https://www.radio.de/s/bachatamix" target="_blank">Bachata Mix auf radio.de</a></noscript></li>
          <br>
          <p class="cp-text">Seitenmenü Designed by Daishi © Copyright 2024 Daishi’s-Forum. All rights reserved.</p>
          <br>
          <a href="https://www.radio.de/privacy-policy" style="float:left;">Datenschutzerklärung von <i>radio.de</i></a>
        </ul>
      </li>
      <!-- Ende hier endet das Online Radio --> 
        
        
<!-- Anfang hier beginnt der  Account --> 
      <li>
      {{user_registered==true.start}}
      <div class="icon-link">
      <a href="" target="_blank" title="">
      <i class="bx bxs-user-detail"></i>
      <span class="link_name">Account</span>
      </a>
      <i class="bx bxs-chevron-down arrow" title="Menü öffnen"></i>
      </div>
      <ul class="sub-menu" style="width:250px;">
      <center> Guten Tag {{user_registered==true.start}}{{user_name}}{{user_registered==true.else}}lieber Besucher{{user_registered==true.end}}</center><br>
      <li><span id="news-headline" style="background: {{global_box_header_background|rgb_lightness(91)}}; cursor:default;"><strong>Account</strong></span></li>
                           
      <li><span><a href="javascript:void(0)" onclick="$('#global-news-box-wrap').hide(); window.location.href='{{link_myratings}}'; return false;"><span style="width:300; padding:2px; height:15px;"><img src="//files.homepagemodules.de/b104774/f46t1197p2704n22_phKvdXmg.png"> Persönliche Bewertungen</span></a></span></li>
 
      <li><span><a href="javascript:void(0)" onclick="$('#global-news-box-wrap').hide(); window.location.href='{{link_myprofile}}'; return false;"><span style="width:300; padding:2px; height:15px;"><img src="//files.homepagemodules.de/b104774/f46t1197p2704n22_phKvdXmg.png"> Eigenes Profil</span></a></span></li>
 
      <li><span><a href="javascript:void(0)" onclick="$('#global-news-box-wrap').hide(); window.location.href='{{link_memberdata}}'; return false;"><span style="width:300; padding:2px; height:15px;"><img src="//files.homepagemodules.de/b2001010/a_1006_3b5a4b20.png"> Profil bearbeiten</span></a></span></li>
 
      <li><span><a href="javascript:void(0)" onclick="$('#global-news-box-wrap').hide();  window.location.href='{{link_myprofile}}#comment';return false;"><span style="width:300; padding:2px; height:15px;"><img src="//img.homepagemodules.de/ds/static/feedicons/gbook.png"> Gästebuch</span></a></span></li>
 	
      <li><span><a href="javascript:void(0)" onclick="$('#global-news-box-wrap').hide();xob_redirect('{{link_mails}}')"><span style="width:300; padding:2px; height:15px;"><img src="//files.homepagemodules.de/b2001010/a_1007_09ecc3fc.png"> Private Nachrichten</span></a></span></li>
        
	  <li><span><a href="javascript:void(0)" onclick="$('#global-news-box-wrap').hide(); window.location.href='{{link_config}}'; return false;"><span style="width:300; padding:2px; height:15px;"><img src="//files.homepagemodules.de/b2001010/a_1008_5b0b27e9.png"> Einstellungen</span></a></span></li>
      {{user_registered==true.else}}
      {{user_registered==true.end}} 
      </ul>
</li> 
<!-- Ende hier endet der  Account -->                  
 
<!-- Anfang hier beginnt der  Hier sehen sie das Team --> 
        <li>
        <div class="icon-link">
        <i class='bx bxs-user-badge'></i>
        <span class="link_name"></span>
        </a>
        <i class="bx bxs-chevron-down arrow" title="Menü öffnen"></i>
        </div>
        <ul class="sub-menu" style="width:250px;">
        <span class="link_name"></span>
        <center> Guten Tag {{user_registered==true.start}}{{user_name}}{{user_registered==true.else}}lieber Besucher{{user_registered==true.end}}! <br> <br>Hier sehen sie das Team</center><br>
        <br>
        <li><a href="https://daishis-forum.xobor.de/u1_Daishi.html" title="zum Profil"><img class="sside_nav_link-img" src="https://files.homepagemodules.de/b916726/avatar-90c6f570-1.jpg" alt="" width="25" height="25">&nbsp;&nbsp;&nbsp;&nbsp;  &nbsp;&nbsp; &nbsp;&nbsp;  <span class="nav__count" title="Daishi!">Admin</span></a></li><br>
        <li><a href="#" title="zum Profil"><img class="sside_nav_link-img" src="https://files.homepagemodules.de/b906480/a_1_2cd0d9d6.png" alt="" width="25" height="25">&nbsp;&nbsp;&nbsp;&nbsp;  &nbsp;&nbsp; &nbsp;&nbsp;  <span class="nav__count" title="Name!">Co.Admin</span></a></li><br>
        <li><a href="#" title="zum Profil"><img class="sside_nav_link-img" src="https://files.homepagemodules.de/b906480/a_1_2cd0d9d6.png" alt="" width="25" height="25">&nbsp;&nbsp;&nbsp;&nbsp;  &nbsp;&nbsp; &nbsp;&nbsp;  <span class="nav__count" title="Name!">Moderator</span></a></li><br>
        <li><a href="#" title="zum Profil"><img class="sside_nav_link-img" src="https://files.homepagemodules.de/b906480/a_1_2cd0d9d6.png" alt="" width="25" height="25">&nbsp;&nbsp;&nbsp;&nbsp;  &nbsp;&nbsp; &nbsp;&nbsp;  <span class="nav__count" title="Name!">Designer</span></a></li><br>
        <li><a href="#" title="zum Profil"><img class="sside_nav_link-img" src="https://files.homepagemodules.de/b906480/a_1_2cd0d9d6.png" alt="" width="25" height="25">&nbsp;&nbsp;&nbsp;&nbsp;  &nbsp;&nbsp; &nbsp;&nbsp;  <span class="nav__count" title="Name!">Programierer</span></a></li><br>
        </ul>
</li>
<!-- Ende hier endet der  Hier sehen sie das Team -->
 
<!-- Anfang hier beginnt die  Administration -->
       <li>
       {{user_admin==true.start}}
       <a href="">
       <i class="bx bx-cog"></i>
       <span class="link_name">Administration</span>
       </a>
       <ul class="sub-menu" style="width:250px;">
       <li><a class="link_name" href="./admin/">Administration</a></li>
       </ul>
       {{user_admin==true.else}}
       {{user_admin==true.end}}
</li>
 
<!-- Ende hier endet die  Administration -->
 

<br>
 

  <!-- Anfang hier beginnt der Kalender -->
<li>
<div class="container-crew">
<div class="main-crew">
  <div class="sub-crew">
    <div class="top-crew">
      <ul>
        <li></li>
        <li></li>
        <li></li>
      </ul>
    </div>
    <div class="year-crew">
      <div id="month2"></div>
      <div id="year2"></div>
    </div>
  </div>
  <div class="date-crew">
    <p id="date2"></p>
    <p id="day2"></p>
  </div>
</div>
</div>
</ul>
      </li> 
<!-- Ende hier beginnt der Kalender -->
         
       
   <!-- Anfang hier beginnt der Name mit information und Bild -->                    
      <li>
        <div class="profile-details">
          <div class="profile-content" style="padding-left:5px;">
            <img src="https://files.homepagemodules.de/b916726/a_16_0b880956.png" alt="profileImg">
          </div>
          <div class="name-job">
            <div class="profile_name"><font color =white>Daishi Bangladesch</font></div>
            <div class="job"><font color =white>Daishi&#146;s-Forum</font></div>
          </div>
         <a href="./login.php?option=logout" style="font-size:40px; color: #ffffff; padding-right:5px;"><i class='bx bx-log-out'></i></a></li>
        </div>
      </li>
	   <!-- Ende hier beginnt der Name mit information und Bild -->
 
    </ul>
  </div>
`);
</script>
 
<!-- Ende Hier endet das ende javascript / HTML - Code für die Module für das Seitenmenü  -->
 
<!-- Anfang Hier beginnen die javascripte  -->
 
<script>
    let arrow = document.querySelectorAll(".arrow");
    for (var i = 0; i < arrow.length; i++) {
        arrow[i].addEventListener("click", (e) => {
            let arrowParent = e.target.parentElement.parentElement; //Auswahl des übergeordneten Elements des Pfeils
            arrowParent.classList.toggle("showMenu");
        });
    }
 
    let sidebar = document.querySelector(".side_page");
    let sidebarBtn = document.querySelector(".bx-menu");
    console.log(sidebarBtn);
    sidebarBtn.addEventListener("click", () => {
        sidebar.classList.toggle("close");
    });
 
    const month2 = new Date();
    const options = { month: "long" };
    const year1 = new Date();
    const date1 = new Date();
    const day2 = new Date();
    const options2 = { weekday: "long" };
 
    let year2 = year1.getFullYear();
    let date2 = date1.getDate();
 
    function myKalender() {
        document.getElementById("year2").innerText = year2;
        document.getElementById("month2").innerText = month2.toLocaleString("de-Germania", options);
        document.getElementById("date2").innerText = date2;
        document.getElementById("day2").innerText = day2.toLocaleString("de-Germania", options2);
    }
    myKalender();
 
    //# sourceURL=pen.js
 
    //# Anfang hier beginnt die Sprache mit alexa
 
    window.addEventListener("load", function () {
        message1 = new SpeechSynthesisUtterance();
 
        message1.text = `
 
Herzlich Willkommen auf Daishi´s-Forum! 
  
Um das Seitenmenü im Vollem umfang benutzen zu können, müssen sie sich registrieren. 
 
Hier Können nur registrierte User diese Funktion nutzen. Für Gäste wird nicht vollständig das Seitenmenü angezeigt. 
 
Dies ist eine neue Sicherheitsfunktion im Seitenmenü! Danke! Viel Spaß Euere Alexa 
 

`;
 
        speechSynthesis.cancel();
 
        speechSynthesis.onvoiceschanged = function (e) {
            voices = speechSynthesis.getVoices();
 
            message1.voice = voices[0]; // 0=Hedda DE - Default // 2=Stefan DE
        };
 
        $(".TextToSpeech1").on("click", function (e) {
            if (speechSynthesis.speaking) {
                speechSynthesis.cancel();
            } else {
                speechSynthesis.speak(message1);
            }
        });
    });
    //# Ende hier endet die Sprache mit alexa
 
    //# Anfang hier beginnt das Online Radio
    (function (d, s) {
        if (!window.rel) {
            s = d.createElement("script");
            s.type = "text/javascript";
            s.async = true;
            s.id = "radio-de-embedded";
            s.src = "https://www.radio.de/inc/microsite/js/full.js";
            d.getElementsByTagName("head")[0].appendChild(s);
            window.rel = true;
        }
    })(document);
    //# Ende hier endet das Online Radio
</script>
 
<!-- Ende Hier enden die javascripte  -->