|
|
| Zeile 1: |
Zeile 1: |
| /* Das folgende CSS wird für alle Benutzeroberflächen geladen. */ | | /* Das folgende CSS wird für alle Benutzeroberflächen geladen. */ |
| /* ===== Popup Hintergrund ===== */
| |
| .mw-popup-overlay {
| |
| position: fixed;
| |
| inset: 0;
| |
| background: rgba(0,0,0,0.4);
| |
| z-index: 10000;
| |
| }
| |
|
| |
| /* ===== Popup Container ===== */
| |
| .mw-popup-modal {
| |
| position: fixed;
| |
| top: 50%;
| |
| left: 50%;
| |
| transform: translate(-50%, -50%);
| |
| background: #fff;
| |
| max-width: 90%;
| |
| padding: 20px;
| |
| border-radius: 8px;
| |
| z-index: 10001;
| |
| text-align: center;
| |
| box-shadow: 0 6px 20px rgba(0,0,0,0.3);
| |
| }
| |
|
| |
| /* ===== Logo-Bereich mit Herz ===== */
| |
| .mw-popup-logo {
| |
| position: relative;
| |
| display: inline-block;
| |
| margin-bottom: 10px;
| |
| }
| |
|
| |
| .mw-popup-logo img {
| |
| max-width: 120px;
| |
| position: relative;
| |
| z-index: 2;
| |
| }
| |
|
| |
| /* Herz-Hintergrund */
| |
| .mw-popup-heart {
| |
| position: absolute;
| |
| top: 50%;
| |
| left: 50%;
| |
| width: 140px;
| |
| height: 140px;
| |
| background: red;
| |
| transform: translate(-50%, -50%) rotate(-45deg);
| |
| transform-origin: center;
| |
| z-index: 1;
| |
| animation: pulse 1.5s infinite;
| |
| }
| |
| .mw-popup-heart::before,
| |
| .mw-popup-heart::after {
| |
| content: "";
| |
| position: absolute;
| |
| width: 140px;
| |
| height: 140px;
| |
| background: red;
| |
| border-radius: 50%;
| |
| }
| |
| .mw-popup-heart::before {
| |
| top: -70px;
| |
| left: 0;
| |
| }
| |
| .mw-popup-heart::after {
| |
| left: 70px;
| |
| top: 0;
| |
| }
| |
|
| |
| /* Puls-Animation */
| |
| @keyframes pulse {
| |
| 0%, 100% { transform: translate(-50%, -50%) rotate(-45deg) scale(1); }
| |
| 50% { transform: translate(-50%, -50%) rotate(-45deg) scale(1.1); }
| |
| }
| |
|
| |
| /* ===== Überschrift ===== */
| |
| .mw-popup-modal h2 {
| |
| margin: 0 0 0.5em;
| |
| font-size: 1.25em;
| |
| }
| |
|
| |
| /* ===== Textbereich ===== */
| |
| .mw-popup-content p {
| |
| margin: 0.5em 0;
| |
| font-size: 1.05em;
| |
| line-height: 1.4;
| |
| text-align: center;
| |
| }
| |
|
| |
| /* ===== Button ===== */
| |
| .mw-popup-close {
| |
| margin-top: 1em;
| |
| padding: 8px 12px;
| |
| border: none;
| |
| background: #36c;
| |
| color: white;
| |
| border-radius: 4px;
| |
| cursor: pointer;
| |
| }
| |
| .mw-popup-close:hover {
| |
| background: #258;
| |
| }
| |
