Widget:StartseitenSuche: Unterschied zwischen den Versionen
Aus MediaWiki
Admin (Diskussion | Beiträge) Die Seite wurde neu angelegt: „<includeonly> Test Widget Startseite <ul> <!--{foreach from=$arg key=key item=item}--> <li><!--{$key|escape:'html'}-->: set to <!--{$item|escape:'html'}--></li> <!--{/foreach}--> </ul></includeonly>“ |
Admin (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung Markierung: Manuelle Zurücksetzung |
||
| (13 dazwischenliegende Versionen von 2 Benutzern werden nicht angezeigt) | |||
| Zeile 1: | Zeile 1: | ||
<includeonly> | <includeonly> | ||
<style type="text/css"> | |||
< | .perplexity-search { | ||
display: inline-block; | |||
padding: 10px; | |||
< | background-color: #f0f0f0; | ||
</ | border-radius: 5px; | ||
width: max-content; | |||
} | |||
.perplexity-search input[type="text"] { | |||
width: 300px; | |||
} | |||
.perplexity-search input[type="submit"] { | |||
padding: 0px 20px; | |||
background-color: #4CAF50; | |||
color: white; | |||
border: none; | |||
border-radius: 3px; | |||
} | |||
.overlay-container { | |||
position: relative; | |||
width: 100%; | |||
display: inline-block; | |||
background-image:url("/w/images/a/a9/Schloss-Muenster-Philipp-Foelting-CC-BY-SA.jpg"); | |||
background-size: cover; | |||
background-position: center; | |||
min-height:400px; | |||
} | |||
.overlay-content { | |||
position: absolute; | |||
top: 50%; /* Position des Widgets */ | |||
left: 50%; | |||
transform: translate(-50%, -50%); | |||
color: white; /* Textfarbe: Weiß */ | |||
background-color: #00308D; /* Hintergrundfarbe: Blau */ | |||
border-radius: 15px; /* Abgerundete Ecken */ | |||
padding: 20px; | |||
text-align: center; | |||
width: 80%; /* Breite des Widgets, kannst du anpassen */ | |||
} | |||
.overlay-content p { | |||
margin: 10px 0; /* Abstand zwischen den Textabsätzen */ | |||
} | |||
.overlay-content .headline-text { | |||
font-size: 1.5em; /* Größerer Schriftzug */ | |||
font-weight: bold; /* Dickere Schrift */ | |||
margin: 10px 0; | |||
} | |||
/* To make images responsive */ | |||
.img-fluid img { | |||
max-width:100%; | |||
height:auto; | |||
} | |||
</style> | |||
<div class="overlay-container"> | |||
<div class="overlay-content"> | |||
<p class="headline-text">Wonach suchst du?</p> | |||
<div class="perplexity-search"> | |||
<form onsubmit="window.open('https://www.perplexity.ai/?q=' + encodeURIComponent(this.query.value), '_blank'); return false;"> | |||
<input type="text" name="query" placeholder="z. B. Wie melde ich mich um?"> | |||
<input type="submit" value="Suche"> | |||
</form> | |||
</div> | |||
<p>Unser Münster Wiki und alle weitere Informationen aus den öffentlichen Seiten der Stadt Münster stehen dir hier zur Verfügung</p> | |||
</div> | |||
</div> | |||
</includeonly> | |||
