💄 fix copylinks starting under nav (fix #112)

This commit is contained in:
DrMaxNix 2024-07-26 14:00:12 +02:00
parent 90ed829978
commit f5f967a64b
3 changed files with 559 additions and 516 deletions

View File

@ -62,198 +62,212 @@
<h2><?= $dict->get("page_title_h2") ?></h2>
</div>
<div class="section">
<div id="why" class="content">
<div class="box">
<span class="title"><button class="copylink ti ti-link"></button><?= $dict->get("why_title") ?></span>
<?php
$why_text = $dict->get("why_text");
foreach($why_text as $one_why_text_line){
echo("<span>" . $one_why_text_line . "</span>");
}
?>
</div>
</div>
</div>
<div id="timeline" class="section">
<div class="header">
<span class="icon ti ti-clock"></span>
<span class="text"><?= $dict->get("timeline_moved_title") ?></span>
<button class="copylink ti ti-link"></button>
</div>
<div class="content">
<div class="box">
<?php
$timeline_moved_text = $dict->get("timeline_moved_text");
foreach($timeline_moved_text as $one_timeline_moved_text_line){
echo("<span>" . $one_timeline_moved_text_line . "</span>");
}
?>
<div class="button-list">
<a href="<?= $dict->get("timeline_moved_link") ?>" class="button primary">
<span class="text"><?= $dict->get("timeline_moved_button") ?></span>
<span class="icon ti ti-chevron-right"></span>
</a>
<div id="why" class="wrapper copylink-id">
<div class="section">
<div class="content">
<div class="box">
<span class="title"><button class="copylink ti ti-link"></button><?= $dict->get("why_title") ?></span>
<?php
$why_text = $dict->get("why_text");
foreach($why_text as $one_why_text_line){
echo("<span>" . $one_why_text_line . "</span>");
}
?>
</div>
</div>
</div>
</div>
<div id="news" class="section">
<div class="header">
<span class="icon ti ti-bell"></span>
<span class="text"><?= $dict->get("news_title") ?></span>
<button class="copylink ti ti-link"></button>
</div>
<div class="content rows">
<div id="newsletter" class="box">
<span class="title"><button class="copylink ti ti-link"></button><?= $dict->get("news_newsletter_title") ?></span>
<div id="newsletter-signup-form-container" class="form-container">
<div id="newsletter-signup-form" class="form">
<div class="key-value-pair">
<div class="key">
<span class="ti ti-at"></span>
</div>
<div class="value-list">
<div class="inputwrapper">
<input id="newsletter-signup-form-mail-address" class="value" type="text" placeholder="<?= $dict->get("news_newsletter_mail_address") ?>" autocomplete="off" />
</div>
</div>
</div>
<div class="key-value-pair">
<div class="key">
<span class="ti ti-world"></span>
</div>
<div class="value-list">
<div id="newsletter-signup-form-language" class="value switch" data-selected="<?= $lang->get() ?>">
<?php foreach(["de", "en"] as $one_lang){ ?>
<button class="option" data-value="<?= $one_lang ?>">
<span class="text"><?= strtoupper($one_lang) ?></span>
</button>
<?php } ?>
</div>
</div>
</div>
<button id="newsletter-signup-form-submit" class="button primary">
<span class="text"><?= $dict->get("news_newsletter_subscribe") ?></span>
<div id="timeline" class="wrapper copylink-id">
<div class="section">
<div class="header">
<span class="icon ti ti-clock"></span>
<span class="text"><?= $dict->get("timeline_moved_title") ?></span>
<button class="copylink ti ti-link"></button>
</div>
<div class="content">
<div class="box">
<?php
$timeline_moved_text = $dict->get("timeline_moved_text");
foreach($timeline_moved_text as $one_timeline_moved_text_line){
echo("<span>" . $one_timeline_moved_text_line . "</span>");
}
?>
<div class="button-list">
<a href="<?= $dict->get("timeline_moved_link") ?>" class="button primary">
<span class="text"><?= $dict->get("timeline_moved_button") ?></span>
<span class="icon ti ti-chevron-right"></span>
</button>
</a>
</div>
<div id="newsletter-signup-form-feedback" class="form-feedback gone">
<div id="newsletter-signup-form-feedback-wait" class="form-feedback-wait centertext gone">
<span class="icon spinning ti ti-loader-2"></span>
<span class="text"><?= $dict->get("news_newsletter_feedback_wait") ?></span>
</div>
<div id="newsletter-signup-form-feedback-success" class="form-feedback-success centertext gone">
<span class="icon ti ti-check"></span>
<span class="text"><?= $dict->get("news_newsletter_feedback_success") ?></span>
</div>
<div id="newsletter-signup-form-feedback-failure" class="form-feedback-failure centertext gone">
<span class="icon ti ti-x"></span>
<span class="text"><?= $dict->get("news_newsletter_feedback_failure") ?></span>
</div>
</div>
</div>
<span class="inline"><?= $dict->get("news_newsletter_process_description") ?></span>
<span class="inline gray"><?= $dict->get("news_newsletter_note") ?></span>
</div>
<div id="social-media" class="box">
<span class="title"><button class="copylink ti ti-link"></button><?= $dict->get("news_social_media_title") ?></span>
<div class="button-list">
<a href="https://www.instagram.com/sbgg.jetzt" target="_blank" class="button">
<span class="icon big ti ti-brand-instagram"></span>
<div class="text">
<span>Instagram</span>
<span class="gray">@sbgg.jetzt</span>
</div>
<span class="icon ti ti-external-link"></span>
</a>
<a href="https://lsbt.me/@sbggjetzt" target="_blank" class="button">
<span class="icon big ti ti-brand-mastodon"></span>
<div class="text">
<span>Mastodon</span>
<span class="gray">@sbggjetzt@lsbt.me</span>
</div>
<span class="icon ti ti-external-link"></span>
</a>
</div>
</div>
</div>
</div>
<div id="recommendations" class="section">
<div class="header">
<span class="icon ti ti-comet"></span>
<span class="text"><?= $dict->get("recommendations_title") ?></span>
<button class="copylink ti ti-link"></button>
</div>
<div class="content">
<div class="card-list">
<a href="https://pstg45b.de" class="card">
<img src="<?= File::file("../sbgg.jetzt-proprietary-assets/asset/pstg45bde.png") ?>" />
<div class="text">
<span class="title"><?= $dict->get("recommendations_pstg45bde_title") ?></span>
<span class="description"><?= $dict->get("recommendations_pstg45bde_description") ?></span>
</div>
</a>
<a href="https://blahaj.academy" class="card">
<img src="<?= File::file("../sbgg.jetzt-proprietary-assets/asset/blahajacademy.png") ?>" />
<div class="text">
<span class="title"><?= $dict->get("recommendations_blahajacademy_title") ?></span>
<span class="description"><?= $dict->get("recommendations_blahajacademy_description") ?></span>
</div>
</a>
<a href="https://sbgg.info/" class="card">
<img src="<?= File::file("../sbgg.jetzt-proprietary-assets/asset/sbgginfo.jpg") ?>" class="rounded" />
<div class="text">
<span class="title"><?= $dict->get("recommendations_sbgginfo_title") ?></span>
<span class="description"><?= $dict->get("recommendations_sbgginfo_description") ?></span>
</div>
</a>
<div id="news" class="wrapper copylink-id">
<div class="section">
<div class="header">
<span class="icon ti ti-bell"></span>
<span class="text"><?= $dict->get("news_title") ?></span>
<button class="copylink ti ti-link"></button>
</div>
<div class="content rows">
<div id="newsletter" class="wrapper copylink-id">
<div class="box">
<span class="title"><button class="copylink ti ti-link"></button><?= $dict->get("news_newsletter_title") ?></span>
<div id="newsletter-signup-form-container" class="form-container">
<div id="newsletter-signup-form" class="form">
<div class="key-value-pair">
<div class="key">
<span class="ti ti-at"></span>
</div>
<div class="value-list">
<div class="inputwrapper">
<input id="newsletter-signup-form-mail-address" class="value" type="text" placeholder="<?= $dict->get("news_newsletter_mail_address") ?>" autocomplete="off" />
</div>
</div>
</div>
<div class="key-value-pair">
<div class="key">
<span class="ti ti-world"></span>
</div>
<div class="value-list">
<div id="newsletter-signup-form-language" class="value switch" data-selected="<?= $lang->get() ?>">
<?php foreach(["de", "en"] as $one_lang){ ?>
<button class="option" data-value="<?= $one_lang ?>">
<span class="text"><?= strtoupper($one_lang) ?></span>
</button>
<?php } ?>
</div>
</div>
</div>
<button id="newsletter-signup-form-submit" class="button primary">
<span class="text"><?= $dict->get("news_newsletter_subscribe") ?></span>
<span class="icon ti ti-chevron-right"></span>
</button>
</div>
<div id="newsletter-signup-form-feedback" class="form-feedback gone">
<div id="newsletter-signup-form-feedback-wait" class="form-feedback-wait centertext gone">
<span class="icon spinning ti ti-loader-2"></span>
<span class="text"><?= $dict->get("news_newsletter_feedback_wait") ?></span>
</div>
<div id="newsletter-signup-form-feedback-success" class="form-feedback-success centertext gone">
<span class="icon ti ti-check"></span>
<span class="text"><?= $dict->get("news_newsletter_feedback_success") ?></span>
</div>
<div id="newsletter-signup-form-feedback-failure" class="form-feedback-failure centertext gone">
<span class="icon ti ti-x"></span>
<span class="text"><?= $dict->get("news_newsletter_feedback_failure") ?></span>
</div>
</div>
</div>
<span class="inline"><?= $dict->get("news_newsletter_process_description") ?></span>
<span class="inline gray"><?= $dict->get("news_newsletter_note") ?></span>
</div>
</div>
<div id="social-media" class="wrapper copylink-id">
<div class="box">
<span class="title"><button class="copylink ti ti-link"></button><?= $dict->get("news_social_media_title") ?></span>
<div class="button-list">
<a href="https://www.instagram.com/sbgg.jetzt" target="_blank" class="button">
<span class="icon big ti ti-brand-instagram"></span>
<div class="text">
<span>Instagram</span>
<span class="gray">@sbgg.jetzt</span>
</div>
<span class="icon ti ti-external-link"></span>
</a>
<a href="https://lsbt.me/@sbggjetzt" target="_blank" class="button">
<span class="icon big ti ti-brand-mastodon"></span>
<div class="text">
<span>Mastodon</span>
<span class="gray">@sbggjetzt@lsbt.me</span>
</div>
<span class="icon ti ti-external-link"></span>
</a>
</div>
</div>
</div>
</div>
<span class="note inline gray"><?= $dict->get("recommendations_note") ?></span>
</div>
</div>
<div id="about" class="section">
<div class="header">
<span class="icon ti ti-heart"></span>
<span class="text"><?= $dict->get("about_title") ?></span>
<button class="copylink ti ti-link"></button>
</div>
<div class="content">
<div class="box">
<?php
$about_text = $dict->get("about_text");
foreach($about_text as $one_about_text_line){
echo("<span>" . $one_about_text_line . "</span>");
}
?>
<div id="recommendations" class="wrapper copylink-id">
<div class="section">
<div class="header">
<span class="icon ti ti-comet"></span>
<span class="text"><?= $dict->get("recommendations_title") ?></span>
<button class="copylink ti ti-link"></button>
</div>
<div class="content">
<div class="card-list">
<a href="https://pstg45b.de" class="card">
<img src="<?= File::file("../sbgg.jetzt-proprietary-assets/asset/pstg45bde.png") ?>" />
<div class="text">
<span class="title"><?= $dict->get("recommendations_pstg45bde_title") ?></span>
<span class="description"><?= $dict->get("recommendations_pstg45bde_description") ?></span>
</div>
</a>
<a href="https://blahaj.academy" class="card">
<img src="<?= File::file("../sbgg.jetzt-proprietary-assets/asset/blahajacademy.png") ?>" />
<div class="text">
<span class="title"><?= $dict->get("recommendations_blahajacademy_title") ?></span>
<span class="description"><?= $dict->get("recommendations_blahajacademy_description") ?></span>
</div>
</a>
<a href="https://sbgg.info/" class="card">
<img src="<?= File::file("../sbgg.jetzt-proprietary-assets/asset/sbgginfo.jpg") ?>" class="rounded" />
<div class="text">
<span class="title"><?= $dict->get("recommendations_sbgginfo_title") ?></span>
<span class="description"><?= $dict->get("recommendations_sbgginfo_description") ?></span>
</div>
</a>
</div>
<div class="button-list">
<a <?= Hidden::href("mailto:mail@sb"."gg.jetzt") ?> class="button primary">
<span class="icon ti ti-mail"></span>
<span class="text"><?= $dict->get("about_button_mail") ?></span>
</a>
<a href="https://kimendisch.de" class="button">
<span class="icon ti ti-home"></span>
<span class="text"><?= $dict->get("about_button_website") ?></span>
</a>
<span class="note inline gray"><?= $dict->get("recommendations_note") ?></span>
</div>
</div>
</div>
<div id="about" class="wrapper copylink-id">
<div class="section">
<div class="header">
<span class="icon ti ti-heart"></span>
<span class="text"><?= $dict->get("about_title") ?></span>
<button class="copylink ti ti-link"></button>
</div>
<div class="content">
<div class="box">
<?php
$about_text = $dict->get("about_text");
foreach($about_text as $one_about_text_line){
echo("<span>" . $one_about_text_line . "</span>");
}
?>
<div class="button-list">
<a <?= Hidden::href("mailto:mail@sb"."gg.jetzt") ?> class="button primary">
<span class="icon ti ti-mail"></span>
<span class="text"><?= $dict->get("about_button_mail") ?></span>
</a>
<a href="https://kimendisch.de" class="button">
<span class="icon ti ti-home"></span>
<span class="text"><?= $dict->get("about_button_website") ?></span>
</a>
</div>
</div>
</div>
</div>

View File

@ -454,14 +454,14 @@ a.box:hover {
flex-direction: column;
}
.timeline > .item {
.timeline > .item, .timeline > .wrapper > .item {
display: flex;
flex-direction: row;
align-items: center;
gap: 1rem;
}
.timeline > .item > .connector {
.timeline > .item > .connector, .timeline > .wrapper > .item > .connector {
align-self: stretch;
position: relative;
@ -470,7 +470,7 @@ a.box:hover {
flex-direction: column;
justify-content: center;
}
.timeline > .item:not(:first-child) > .connector::before, .timeline > .item:not(:last-child) > .connector::after {
.timeline > .item:not(:first-child) > .connector::before, .timeline > .wrapper:not(:first-child) > .item > .connector::before, .timeline > .item:not(:last-child) > .connector::after, .timeline > .wrapper:not(:last-child) > .item > .connector::after {
content: "";
position: absolute;
left: calc(50% - 0.25rem);
@ -481,24 +481,24 @@ a.box:hover {
background-color: var(--color-bg-light);
z-index: 0;
}
.timeline > .item > .connector::before {
.timeline > .item > .connector::before, .timeline > .wrapper > .item > .connector::before {
top: 0;
}
.timeline > .item.done > .connector::before {
.timeline > .item.done > .connector::before, .timeline > .wrapper > .item.done > .connector::before {
background-color: var(--theme);
}
.timeline > .item.next > .connector::before {
.timeline > .item.next > .connector::before, .timeline > .wrapper > .item.next > .connector::before {
background-color: var(--theme);
}
.timeline > .item > .connector::after {
.timeline > .item > .connector::after, .timeline > .wrapper > .item > .connector::after {
top: 50%;
z-index: 1 !important;
}
.timeline > .item.done > .connector::after {
.timeline > .item.done > .connector::after, .timeline > .wrapper > .item.done > .connector::after {
background-color: var(--theme);
}
.timeline > .item > .connector > .waypoint {
.timeline > .item > .connector > .waypoint, .timeline > .wrapper > .item > .connector > .waypoint {
padding: 1rem;
font-size: 1.5rem;
@ -506,15 +506,15 @@ a.box:hover {
background-color: var(--color-bg-light);
z-index: 2;
}
.timeline > .item.done > .connector > .waypoint {
.timeline > .item.done > .connector > .waypoint, .timeline > .wrapper > .item.done > .connector > .waypoint {
color: var(--color-bg);
background-color: var(--theme);
}
.timeline > .item.next > .connector > .waypoint {
.timeline > .item.next > .connector > .waypoint, .timeline > .wrapper > .item.next > .connector > .waypoint {
background-color: var(--color-gray-dark);
}
.timeline > .item > .box {
.timeline > .item > .box, .timeline > .wrapper > .item > .box {
flex-grow: 1;
align-items: flex-start;
@ -523,24 +523,24 @@ a.box:hover {
text-align: left;
}
.timeline > .item:first-child > .box {
.timeline > .item:first-child > .box, .timeline > .wrapper:first-child > .item > .box {
margin: 0 0 1rem 0;
}
.timeline > .item:last-child > .box {
.timeline > .item:last-child > .box, .timeline > .wrapper:last-child > .item > .box {
margin: 1rem 0 0 0;
}
@media only screen and (max-width: 1000px) {
.timeline > .item {
.timeline > .item, .timeline > .wrapper > .item {
position: relative;
flex-direction: column;
gap: 0;
}
.timeline > .item > .connector {
.timeline > .item > .connector, .timeline > .wrapper > .item > .connector {
align-self: center;
}
.timeline > .item:not(:last-child)::after {
.timeline > .item:not(:last-child)::after, .timeline > .wrapper:not(:last-child) > .item::after {
content: "";
position: absolute;
left: calc(50% - 0.25rem);
@ -551,35 +551,35 @@ a.box:hover {
background-color: var(--color-bg-light);
z-index: 0;
}
.timeline > .item.done::after {
.timeline > .item.done::after, .timeline > .wrapper > .item.done::after {
background-color: var(--theme);
}
.timeline > .item.done-stop::after {
.timeline > .item.done-stop::after, .timeline > .wrapper > .item.done-stop::after {
background-color: var(--theme);
}
.timeline > .item:not(:last-child) > .box {
.timeline > .item:not(:last-child) > .box, .timeline > .wrapper:not(:last-child) > .item > .box {
margin: 0 0 4rem 0;
}
.timeline > .item:last-child > .box {
.timeline > .item:last-child > .box, .timeline > .wrapper:last-child > .item > .box {
margin: 0;
}
.timeline > .item > .connector > .waypoint {
.timeline > .item > .connector > .waypoint, .timeline > .wrapper > .item > .connector > .waypoint {
border-radius: 50% 50% 0 0;
}
.timeline > .item > .box {
.timeline > .item > .box, .timeline > .wrapper > .item > .box {
align-items: center;
text-align: center;
}
.timeline > .item > .box {
.timeline > .item > .box, .timeline > .wrapper > .item > .box {
outline: 0.125rem solid var(--color-bg-light);
}
.timeline > .item.done > .box {
.timeline > .item.done > .box, .timeline > .wrapper > .item.done > .box {
outline: 0.125rem solid var(--theme);
}
.timeline > .item.next > .box {
.timeline > .item.next > .box, .timeline > .wrapper > .item.next > .box {
outline: 0.125rem solid var(--color-gray-dark);
}
}
@ -667,14 +667,14 @@ a.box:hover {
/* SECTION: NEWS */
.section > .content.rows > #newsletter, .section > .content.rows > #social-media {
#newsletter .box, #social-media .box {
align-items: flex-start;
}
.section > .content.rows > #newsletter {
#newsletter {
flex-basis: 22rem;
flex-grow: 64;
}
.section > .content.rows > #social-media {
#social-media {
flex-basis: 16rem;
flex-grow: 1;
flex-shrink: 1;
@ -795,6 +795,11 @@ a.box:hover {
/* COPYLINKS */
.wrapper.copylink-id {
padding-top: 5.3rem; /* NOTE: This is tied to `nav .nav-container` */
margin-top: -5.3rem; /* NOTE: This is tied to `nav .nav-container` */
}
.copylink {
position: absolute;
padding: 0.5rem;

View File

@ -49,363 +49,387 @@
<h2><?= $dict->get("timeline_title") ?></h2>
</div>
<div id="timeline" class="section">
<div class="section">
<div class="content">
<div class="timeline">
<div id="koalitionsvertrag" class="item done">
<div class="connector">
<span class="waypoint ti ti-heart-handshake"></span>
</div>
<div class="box">
<?php
$timeline_date = $dict->get("timeline_koalitionsvertrag_date");
if($timeline_date !== null){
?>
<span class="extra"><i class="ti ti-calendar"></i><?= $timeline_date ?></span>
<?php } ?>
<span class="title"><button class="copylink ti ti-link"></button><?= $dict->get("timeline_koalitionsvertrag_title") ?></span>
<?php
$timeline_koalitionsvertrag_text = $dict->get("timeline_koalitionsvertrag_text");
foreach($timeline_koalitionsvertrag_text as $one_timeline_koalitionsvertrag_text_line){
echo("<span>" . $one_timeline_koalitionsvertrag_text_line . "</span>");
}
?>
<div class="button-list">
<a href="https://web.archive.org/web/20230630200056/https://www.spd.de/fileadmin/Dokumente/Koalitionsvertrag/Koalitionsvertrag_2021-2025.pdf" target="_blank" class="button">
<span class="text"><?= $dict->get("timeline_koalitionsvertrag_button") ?></span>
<span class="icon ti ti-external-link"></span>
</a>
<div id="koalitionsvertrag" class="wrapper copylink-id">
<div class="item done">
<div class="connector">
<span class="waypoint ti ti-heart-handshake"></span>
</div>
<div class="box">
<?php
$timeline_date = $dict->get("timeline_koalitionsvertrag_date");
if($timeline_date !== null){
?>
<span class="extra"><i class="ti ti-calendar"></i><?= $timeline_date ?></span>
<?php } ?>
<span class="title"><button class="copylink ti ti-link"></button><?= $dict->get("timeline_koalitionsvertrag_title") ?></span>
<?php
$timeline_koalitionsvertrag_text = $dict->get("timeline_koalitionsvertrag_text");
foreach($timeline_koalitionsvertrag_text as $one_timeline_koalitionsvertrag_text_line){
echo("<span>" . $one_timeline_koalitionsvertrag_text_line . "</span>");
}
?>
<div class="button-list">
<a href="https://web.archive.org/web/20230630200056/https://www.spd.de/fileadmin/Dokumente/Koalitionsvertrag/Koalitionsvertrag_2021-2025.pdf" target="_blank" class="button">
<span class="text"><?= $dict->get("timeline_koalitionsvertrag_button") ?></span>
<span class="icon ti ti-external-link"></span>
</a>
</div>
</div>
</div>
</div>
<div id="eckpunktepapier" class="item done">
<div class="connector">
<span class="waypoint ti ti-border-corners"></span>
</div>
<div class="box">
<?php
$timeline_date = $dict->get("timeline_eckpunktepapier_date");
if($timeline_date !== null){
?>
<span class="extra"><i class="ti ti-calendar"></i><?= $timeline_date ?></span>
<?php } ?>
<span class="title"><button class="copylink ti ti-link"></button><?= $dict->get("timeline_eckpunktepapier_title") ?></span>
<?php
$timeline_eckpunktepapier_text = $dict->get("timeline_eckpunktepapier_text");
foreach($timeline_eckpunktepapier_text as $one_timeline_eckpunktepapier_text_line){
echo("<span>" . $one_timeline_eckpunktepapier_text_line . "</span>");
}
?>
<div class="button-list">
<a href="https://web.archive.org/web/20230418072943/https://www.bmfsfj.de/resource/blob/199382/1e751a6b7f366eec396d146b3813eed2/20220630-selbstbestimmungsgesetz-eckpunkte-data.pdf" target="_blank" class="button">
<span class="text"><?= $dict->get("timeline_eckpunktepapier_button") ?></span>
<span class="icon ti ti-external-link"></span>
</a>
<div id="eckpunktepapier" class="wrapper copylink-id">
<div class="item done">
<div class="connector">
<span class="waypoint ti ti-border-corners"></span>
</div>
<div class="box">
<?php
$timeline_date = $dict->get("timeline_eckpunktepapier_date");
if($timeline_date !== null){
?>
<span class="extra"><i class="ti ti-calendar"></i><?= $timeline_date ?></span>
<?php } ?>
<span class="title"><button class="copylink ti ti-link"></button><?= $dict->get("timeline_eckpunktepapier_title") ?></span>
<?php
$timeline_eckpunktepapier_text = $dict->get("timeline_eckpunktepapier_text");
foreach($timeline_eckpunktepapier_text as $one_timeline_eckpunktepapier_text_line){
echo("<span>" . $one_timeline_eckpunktepapier_text_line . "</span>");
}
?>
<div class="button-list">
<a href="https://web.archive.org/web/20230418072943/https://www.bmfsfj.de/resource/blob/199382/1e751a6b7f366eec396d146b3813eed2/20220630-selbstbestimmungsgesetz-eckpunkte-data.pdf" target="_blank" class="button">
<span class="text"><?= $dict->get("timeline_eckpunktepapier_button") ?></span>
<span class="icon ti ti-external-link"></span>
</a>
</div>
</div>
</div>
</div>
<div id="referentenentwurf" class="item done">
<div class="connector">
<span class="waypoint ti ti-pencil"></span>
</div>
<div class="box">
<?php
$timeline_date = $dict->get("timeline_referentenentwurf_date");
if($timeline_date !== null){
?>
<span class="extra"><i class="ti ti-calendar"></i><?= $timeline_date ?></span>
<?php } ?>
<span class="title"><button class="copylink ti ti-link"></button><?= $dict->get("timeline_referentenentwurf_title") ?></span>
<?php
$timeline_referentenentwurf_text = $dict->get("timeline_referentenentwurf_text");
foreach($timeline_referentenentwurf_text as $one_timeline_referentenentwurf_text_line){
echo("<span>" . $one_timeline_referentenentwurf_text_line . "</span>");
}
?>
<div class="button-list">
<a href="https://web.archive.org/web/20230610171918/https://www.bmfsfj.de/resource/blob/224548/4d24ff0698216058eb758ada5c84bd90/entwurf-selbstbestimmungsgesetz-data.pdf" target="_blank" class="button">
<span class="text"><?= $dict->get("timeline_referentenentwurf_button") ?></span>
<span class="icon ti ti-external-link"></span>
</a>
<a href="https://web.archive.org/web/20230714124925/https://www.bmj.de/SharedDocs/Downloads/DE/Themen/FamilieUndPartnerschaft/Fragen_und_Antworten_SBGG.pdf?__blob=publicationFile" target="_blank" class="button">
<span class="text"><?= $dict->get("timeline_referentenentwurf_button2") ?></span>
<span class="icon ti ti-external-link"></span>
</a>
<div id="referentenentwurf" class="wrapper copylink-id">
<div class="item done">
<div class="connector">
<span class="waypoint ti ti-pencil"></span>
</div>
<div class="box">
<?php
$timeline_date = $dict->get("timeline_referentenentwurf_date");
if($timeline_date !== null){
?>
<span class="extra"><i class="ti ti-calendar"></i><?= $timeline_date ?></span>
<?php } ?>
<span class="title"><button class="copylink ti ti-link"></button><?= $dict->get("timeline_referentenentwurf_title") ?></span>
<?php
$timeline_referentenentwurf_text = $dict->get("timeline_referentenentwurf_text");
foreach($timeline_referentenentwurf_text as $one_timeline_referentenentwurf_text_line){
echo("<span>" . $one_timeline_referentenentwurf_text_line . "</span>");
}
?>
<div class="button-list">
<a href="https://web.archive.org/web/20230610171918/https://www.bmfsfj.de/resource/blob/224548/4d24ff0698216058eb758ada5c84bd90/entwurf-selbstbestimmungsgesetz-data.pdf" target="_blank" class="button">
<span class="text"><?= $dict->get("timeline_referentenentwurf_button") ?></span>
<span class="icon ti ti-external-link"></span>
</a>
<a href="https://web.archive.org/web/20230714124925/https://www.bmj.de/SharedDocs/Downloads/DE/Themen/FamilieUndPartnerschaft/Fragen_und_Antworten_SBGG.pdf?__blob=publicationFile" target="_blank" class="button">
<span class="text"><?= $dict->get("timeline_referentenentwurf_button2") ?></span>
<span class="icon ti ti-external-link"></span>
</a>
</div>
</div>
</div>
</div>
<div id="regierungsentwurf" class="item done">
<div class="connector">
<span class="waypoint ti ti-notes"></span>
</div>
<div class="box">
<?php
$timeline_date = $dict->get("timeline_regierungsentwurf_date");
if($timeline_date !== null){
?>
<span class="extra"><i class="ti ti-calendar"></i><?= $timeline_date ?></span>
<?php } ?>
<span class="title"><button class="copylink ti ti-link"></button><?= $dict->get("timeline_regierungsentwurf_title") ?></span>
<?php
$timeline_regierungsentwurf_text = $dict->get("timeline_regierungsentwurf_text");
foreach($timeline_regierungsentwurf_text as $one_timeline_regierungsentwurf_text_line){
echo("<span>" . $one_timeline_regierungsentwurf_text_line . "</span>");
}
?>
<div class="button-list">
<a href="https://web.archive.org/web/20230823122446/https://www.bmj.de/SharedDocs/Downloads/DE/Gesetzgebung/RegE/RegE_Selbstbestimmung.pdf?__blob=publicationFile&v=2" target="_blank" class="button">
<span class="text"><?= $dict->get("timeline_regierungsentwurf_button") ?></span>
<span class="icon ti ti-external-link"></span>
</a>
<div id="regierungsentwurf" class="wrapper copylink-id">
<div class="item done">
<div class="connector">
<span class="waypoint ti ti-notes"></span>
</div>
<div class="box">
<?php
$timeline_date = $dict->get("timeline_regierungsentwurf_date");
if($timeline_date !== null){
?>
<span class="extra"><i class="ti ti-calendar"></i><?= $timeline_date ?></span>
<?php } ?>
<span class="title"><button class="copylink ti ti-link"></button><?= $dict->get("timeline_regierungsentwurf_title") ?></span>
<?php
$timeline_regierungsentwurf_text = $dict->get("timeline_regierungsentwurf_text");
foreach($timeline_regierungsentwurf_text as $one_timeline_regierungsentwurf_text_line){
echo("<span>" . $one_timeline_regierungsentwurf_text_line . "</span>");
}
?>
<div class="button-list">
<a href="https://web.archive.org/web/20230823122446/https://www.bmj.de/SharedDocs/Downloads/DE/Gesetzgebung/RegE/RegE_Selbstbestimmung.pdf?__blob=publicationFile&v=2" target="_blank" class="button">
<span class="text"><?= $dict->get("timeline_regierungsentwurf_button") ?></span>
<span class="icon ti ti-external-link"></span>
</a>
</div>
</div>
</div>
</div>
<div id="bundesrat" class="item"></div>
<div id="bundesrat-1" class="item done">
<div class="connector">
<span class="waypoint ti ti-zoom-check"></span>
</div>
<div class="box">
<?php
$timeline_date = $dict->get("timeline_bundesrat_date");
if($timeline_date !== null){
?>
<span class="extra"><i class="ti ti-calendar"></i><?= $timeline_date ?></span>
<?php } ?>
<span class="title"><button class="copylink ti ti-link"></button><?= $dict->get("timeline_bundesrat_title") ?></span>
<?php
$timeline_bundesrat_text = $dict->get("timeline_bundesrat_text");
foreach($timeline_bundesrat_text as $one_timeline_bundesrat_text_line){
echo("<span>" . $one_timeline_bundesrat_text_line . "</span>");
}
?>
<div class="button-list">
<a href="https://yt.artemislena.eu/watch?v=n0chw7-cAsQ" target="_blank" class="button">
<span class="text"><?= $dict->get("timeline_bundesrat_button") ?></span>
<span class="icon ti ti-external-link"></span>
</a>
<a href="https://web.archive.org/web/20231020142352/https://www.bundesrat.de/SharedDocs/drucksachen/2023/0401-0500/432-1-23.pdf?__blob=publicationFile&v=1" target="_blank" class="button">
<span class="text"><?= $dict->get("timeline_bundesrat_button2") ?></span>
<span class="icon ti ti-external-link"></span>
</a>
<div id="bundesrat" class="wrapper copylink-id"></div>
<div id="bundesrat-1" class="wrapper copylink-id">
<div class="item done">
<div class="connector">
<span class="waypoint ti ti-zoom-check"></span>
</div>
<div class="box">
<?php
$timeline_date = $dict->get("timeline_bundesrat_date");
if($timeline_date !== null){
?>
<span class="extra"><i class="ti ti-calendar"></i><?= $timeline_date ?></span>
<?php } ?>
<span class="title"><button class="copylink ti ti-link"></button><?= $dict->get("timeline_bundesrat_title") ?></span>
<?php
$timeline_bundesrat_text = $dict->get("timeline_bundesrat_text");
foreach($timeline_bundesrat_text as $one_timeline_bundesrat_text_line){
echo("<span>" . $one_timeline_bundesrat_text_line . "</span>");
}
?>
<div class="button-list">
<a href="https://yt.artemislena.eu/watch?v=n0chw7-cAsQ" target="_blank" class="button">
<span class="text"><?= $dict->get("timeline_bundesrat_button") ?></span>
<span class="icon ti ti-external-link"></span>
</a>
<a href="https://web.archive.org/web/20231020142352/https://www.bundesrat.de/SharedDocs/drucksachen/2023/0401-0500/432-1-23.pdf?__blob=publicationFile&v=1" target="_blank" class="button">
<span class="text"><?= $dict->get("timeline_bundesrat_button2") ?></span>
<span class="icon ti ti-external-link"></span>
</a>
</div>
</div>
</div>
</div>
<div id="lesung-1" class="item done">
<div class="connector">
<span class="waypoint ti ti-podium"></span>
</div>
<div class="box">
<?php
$timeline_date = $dict->get("timeline_lesung_1_date");
if($timeline_date !== null){
?>
<span class="extra"><i class="ti ti-calendar"></i><?= $timeline_date ?></span>
<?php } ?>
<span class="title"><button class="copylink ti ti-link"></button><?= $dict->get("timeline_lesung_1_title") ?></span>
<?php
$timeline_lesung_1_text = $dict->get("timeline_lesung_1_text");
foreach($timeline_lesung_1_text as $one_timeline_lesung_1_text_line){
echo("<span>" . $one_timeline_lesung_1_text_line . "</span>");
}
?>
<div class="button-list">
<a href="https://www.bundestag.de/dokumente/textarchiv/2023/kw46-de-geschlechtseintrag-976420" target="_blank" class="button">
<span class="text"><?= $dict->get("timeline_lesung_1_button") ?></span>
<span class="icon ti ti-external-link"></span>
</a>
<div id="lesung-1" class="wrapper copylink-id">
<div class="item done">
<div class="connector">
<span class="waypoint ti ti-podium"></span>
</div>
<div class="box">
<?php
$timeline_date = $dict->get("timeline_lesung_1_date");
if($timeline_date !== null){
?>
<span class="extra"><i class="ti ti-calendar"></i><?= $timeline_date ?></span>
<?php } ?>
<span class="title"><button class="copylink ti ti-link"></button><?= $dict->get("timeline_lesung_1_title") ?></span>
<?php
$timeline_lesung_1_text = $dict->get("timeline_lesung_1_text");
foreach($timeline_lesung_1_text as $one_timeline_lesung_1_text_line){
echo("<span>" . $one_timeline_lesung_1_text_line . "</span>");
}
?>
<div class="button-list">
<a href="https://www.bundestag.de/dokumente/textarchiv/2023/kw46-de-geschlechtseintrag-976420" target="_blank" class="button">
<span class="text"><?= $dict->get("timeline_lesung_1_button") ?></span>
<span class="icon ti ti-external-link"></span>
</a>
</div>
</div>
</div>
</div>
<div id="ausschuss-anhoerung" class="item done">
<div class="connector">
<span class="waypoint ti ti-messages"></span>
</div>
<div class="box">
<?php
$timeline_date = $dict->get("timeline_ausschuss_anhoerung_date");
if($timeline_date !== null){
?>
<span class="extra"><i class="ti ti-calendar"></i><?= $timeline_date ?></span>
<?php } ?>
<span class="title"><button class="copylink ti ti-link"></button><?= $dict->get("timeline_ausschuss_anhoerung_title") ?></span>
<?php
$timeline_ausschuss_anhoerung_text = $dict->get("timeline_ausschuss_anhoerung_text");
foreach($timeline_ausschuss_anhoerung_text as $one_timeline_ausschuss_anhoerung_text_line){
echo("<span>" . $one_timeline_ausschuss_anhoerung_text_line . "</span>");
}
?>
<div class="button-list">
<a href="https://www.bundestag.de/dokumente/textarchiv/2023/kw48-pa-familie-selbstbestimmungsgesetz-978748" target="_blank" class="button">
<span class="text"><?= $dict->get("timeline_ausschuss_anhoerung_button") ?></span>
<span class="icon ti ti-external-link"></span>
</a>
<div id="ausschuss-anhoerung" class="wrapper copylink-id">
<div class="item done">
<div class="connector">
<span class="waypoint ti ti-messages"></span>
</div>
<div class="box">
<?php
$timeline_date = $dict->get("timeline_ausschuss_anhoerung_date");
if($timeline_date !== null){
?>
<span class="extra"><i class="ti ti-calendar"></i><?= $timeline_date ?></span>
<?php } ?>
<span class="title"><button class="copylink ti ti-link"></button><?= $dict->get("timeline_ausschuss_anhoerung_title") ?></span>
<?php
$timeline_ausschuss_anhoerung_text = $dict->get("timeline_ausschuss_anhoerung_text");
foreach($timeline_ausschuss_anhoerung_text as $one_timeline_ausschuss_anhoerung_text_line){
echo("<span>" . $one_timeline_ausschuss_anhoerung_text_line . "</span>");
}
?>
<div class="button-list">
<a href="https://www.bundestag.de/dokumente/textarchiv/2023/kw48-pa-familie-selbstbestimmungsgesetz-978748" target="_blank" class="button">
<span class="text"><?= $dict->get("timeline_ausschuss_anhoerung_button") ?></span>
<span class="icon ti ti-external-link"></span>
</a>
</div>
</div>
</div>
</div>
<div id="lesung-2" class="item"></div>
<div id="lesung-3" class="item"></div>
<div id="lesung-2-3" class="item done">
<div class="connector">
<span class="waypoint ti ti-hand-stop"></span>
</div>
<div class="box">
<?php
$timeline_date = $dict->get("timeline_lesung_2_3_date");
if($timeline_date !== null){
?>
<span class="extra"><i class="ti ti-calendar"></i><?= $timeline_date ?></span>
<?php } ?>
<span class="title"><button class="copylink ti ti-link"></button><?= $dict->get("timeline_lesung_2_3_title") ?></span>
<?php
$timeline_lesung_3_text = $dict->get("timeline_lesung_2_3_text");
foreach($timeline_lesung_3_text as $one_timeline_lesung_3_text_line){
echo("<span>" . $one_timeline_lesung_3_text_line . "</span>");
}
?>
<div class="button-list">
<a href="https://www.bundestag.de/dokumente/textarchiv/2024/kw15-de-geschlechtseintrag-997406" target="_blank" class="button">
<span class="text"><?= $dict->get("timeline_lesung_2_3_button") ?></span>
<span class="icon ti ti-external-link"></span>
</a>
<div id="lesung-2" class="wrapper copylink-id"></div>
<div id="lesung-3" class="wrapper copylink-id"></div>
<div id="lesung-2-3" class="wrapper copylink-id">
<div class="item done">
<div class="connector">
<span class="waypoint ti ti-hand-stop"></span>
</div>
<div class="box">
<?php
$timeline_date = $dict->get("timeline_lesung_2_3_date");
if($timeline_date !== null){
?>
<span class="extra"><i class="ti ti-calendar"></i><?= $timeline_date ?></span>
<?php } ?>
<span class="title"><button class="copylink ti ti-link"></button><?= $dict->get("timeline_lesung_2_3_title") ?></span>
<?php
$timeline_lesung_3_text = $dict->get("timeline_lesung_2_3_text");
foreach($timeline_lesung_3_text as $one_timeline_lesung_3_text_line){
echo("<span>" . $one_timeline_lesung_3_text_line . "</span>");
}
?>
<div class="button-list">
<a href="https://www.bundestag.de/dokumente/textarchiv/2024/kw15-de-geschlechtseintrag-997406" target="_blank" class="button">
<span class="text"><?= $dict->get("timeline_lesung_2_3_button") ?></span>
<span class="icon ti ti-external-link"></span>
</a>
</div>
</div>
</div>
</div>
<div id="bundesrat-2" class="item done">
<div class="connector">
<span class="waypoint ti ti-zoom-check"></span>
</div>
<div class="box">
<?php
$timeline_date = $dict->get("timeline_bundesrat_2_date");
if($timeline_date !== null){
?>
<span class="extra"><i class="ti ti-calendar"></i><?= $timeline_date ?></span>
<?php } ?>
<span class="title"><button class="copylink ti ti-link"></button><?= $dict->get("timeline_bundesrat_2_title") ?></span>
<?php
$timeline_bundesrat_2_text = $dict->get("timeline_bundesrat_2_text");
foreach($timeline_bundesrat_2_text as $one_timeline_bundesrat_2_text_line){
echo("<span>" . $one_timeline_bundesrat_2_text_line . "</span>");
}
?>
<div class="button-list">
<a href="https://www.bundesrat.de/DE/service/mediathek/mediathek-node.html?cms_id=0_tb5fzq89" target="_blank" class="button">
<span class="text"><?= $dict->get("timeline_bundesrat_2_button") ?></span>
<span class="icon ti ti-external-link"></span>
</a>
<div id="bundesrat-2" class="wrapper copylink-id">
<div class="item done">
<div class="connector">
<span class="waypoint ti ti-zoom-check"></span>
</div>
<div class="box">
<?php
$timeline_date = $dict->get("timeline_bundesrat_2_date");
if($timeline_date !== null){
?>
<span class="extra"><i class="ti ti-calendar"></i><?= $timeline_date ?></span>
<?php } ?>
<span class="title"><button class="copylink ti ti-link"></button><?= $dict->get("timeline_bundesrat_2_title") ?></span>
<?php
$timeline_bundesrat_2_text = $dict->get("timeline_bundesrat_2_text");
foreach($timeline_bundesrat_2_text as $one_timeline_bundesrat_2_text_line){
echo("<span>" . $one_timeline_bundesrat_2_text_line . "</span>");
}
?>
<div class="button-list">
<a href="https://www.bundesrat.de/DE/service/mediathek/mediathek-node.html?cms_id=0_tb5fzq89" target="_blank" class="button">
<span class="text"><?= $dict->get("timeline_bundesrat_2_button") ?></span>
<span class="icon ti ti-external-link"></span>
</a>
</div>
</div>
</div>
</div>
<div id="bundesgesetzblatt" class="item done done-stop">
<div class="connector">
<span class="waypoint ti ti-news"></span>
</div>
<div class="box">
<?php
$timeline_date = $dict->get("timeline_bundesgesetzblatt_date");
if($timeline_date !== null){
?>
<span class="extra"><i class="ti ti-calendar"></i><?= $timeline_date ?></span>
<?php } ?>
<span class="title"><button class="copylink ti ti-link"></button><?= $dict->get("timeline_bundesgesetzblatt_title") ?></span>
<?php
$timeline_bundesgesetzblatt_text = $dict->get("timeline_bundesgesetzblatt_text");
foreach($timeline_bundesgesetzblatt_text as $one_timeline_bundesgesetzblatt_text_line){
echo("<span>" . $one_timeline_bundesgesetzblatt_text_line . "</span>");
}
?>
<div class="button-list">
<a href="https://web.archive.org/web/20240621093602/https://www.recht.bund.de/bgbl/1/2024/206/regelungstext.pdf?__blob=publicationFile&v=3" target="_blank" class="button">
<span class="text"><?= $dict->get("timeline_bundesgesetzblatt_button") ?></span>
<span class="icon ti ti-external-link"></span>
</a>
<div id="bundesgesetzblatt" class="wrapper copylink-id">
<div class="item done done-stop">
<div class="connector">
<span class="waypoint ti ti-news"></span>
</div>
<div class="box">
<?php
$timeline_date = $dict->get("timeline_bundesgesetzblatt_date");
if($timeline_date !== null){
?>
<span class="extra"><i class="ti ti-calendar"></i><?= $timeline_date ?></span>
<?php } ?>
<span class="title"><button class="copylink ti ti-link"></button><?= $dict->get("timeline_bundesgesetzblatt_title") ?></span>
<?php
$timeline_bundesgesetzblatt_text = $dict->get("timeline_bundesgesetzblatt_text");
foreach($timeline_bundesgesetzblatt_text as $one_timeline_bundesgesetzblatt_text_line){
echo("<span>" . $one_timeline_bundesgesetzblatt_text_line . "</span>");
}
?>
<div class="button-list">
<a href="https://web.archive.org/web/20240621093602/https://www.recht.bund.de/bgbl/1/2024/206/regelungstext.pdf?__blob=publicationFile&v=3" target="_blank" class="button">
<span class="text"><?= $dict->get("timeline_bundesgesetzblatt_button") ?></span>
<span class="icon ti ti-external-link"></span>
</a>
</div>
</div>
</div>
</div>
<div id="anmeldung" class="item next">
<div class="connector">
<span class="waypoint ti ti-ticket"></span>
</div>
<div class="box">
<?php
$timeline_date = $dict->get("timeline_anmeldung_date");
if($timeline_date !== null){
?>
<span class="extra"><i class="ti ti-calendar"></i><?= $timeline_date ?></span>
<?php } ?>
<span class="title"><button class="copylink ti ti-link"></button><?= $dict->get("timeline_anmeldung_title") ?></span>
<?php
$timeline_anmeldung_text = $dict->get("timeline_anmeldung_text");
foreach($timeline_anmeldung_text as $one_timeline_anmeldung_text_line){
echo("<span>" . $one_timeline_anmeldung_text_line . "</span>");
}
?>
<div id="anmeldung" class="wrapper copylink-id">
<div class="item next">
<div class="connector">
<span class="waypoint ti ti-ticket"></span>
</div>
<div class="box">
<?php
$timeline_date = $dict->get("timeline_anmeldung_date");
if($timeline_date !== null){
?>
<span class="extra"><i class="ti ti-calendar"></i><?= $timeline_date ?></span>
<?php } ?>
<span class="title"><button class="copylink ti ti-link"></button><?= $dict->get("timeline_anmeldung_title") ?></span>
<?php
$timeline_anmeldung_text = $dict->get("timeline_anmeldung_text");
foreach($timeline_anmeldung_text as $one_timeline_anmeldung_text_line){
echo("<span>" . $one_timeline_anmeldung_text_line . "</span>");
}
?>
</div>
</div>
</div>
<div id="inkrafttreten" class="item">
<div class="connector">
<span class="waypoint ti ti-gavel"></span>
</div>
<div class="box">
<?php
$timeline_date = $dict->get("timeline_inkrafttreten_date");
if($timeline_date !== null){
?>
<span class="extra"><i class="ti ti-calendar"></i><?= $timeline_date ?></span>
<?php } ?>
<span class="title"><button class="copylink ti ti-link"></button><?= $dict->get("timeline_inkrafttreten_title") ?></span>
<?php
$timeline_inkrafttreten_text = $dict->get("timeline_inkrafttreten_text");
foreach($timeline_inkrafttreten_text as $one_timeline_inkrafttreten_text_line){
echo("<span>" . $one_timeline_inkrafttreten_text_line . "</span>");
}
?>
<div id="inkrafttreten" class="wrapper copylink-id">
<div class="item">
<div class="connector">
<span class="waypoint ti ti-gavel"></span>
</div>
<div class="box">
<?php
$timeline_date = $dict->get("timeline_inkrafttreten_date");
if($timeline_date !== null){
?>
<span class="extra"><i class="ti ti-calendar"></i><?= $timeline_date ?></span>
<?php } ?>
<span class="title"><button class="copylink ti ti-link"></button><?= $dict->get("timeline_inkrafttreten_title") ?></span>
<?php
$timeline_inkrafttreten_text = $dict->get("timeline_inkrafttreten_text");
foreach($timeline_inkrafttreten_text as $one_timeline_inkrafttreten_text_line){
echo("<span>" . $one_timeline_inkrafttreten_text_line . "</span>");
}
?>
</div>
</div>
</div>
</div>