MediaWiki:Common.css: Unterschied zwischen den Versionen
Aus Phoenix-Larp Wiki
Ruby (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
Becko (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
||
(35 dazwischenliegende Versionen von 2 Benutzern werden nicht angezeigt) | |||
Zeile 1: | Zeile 1: | ||
/* Das folgende CSS wird für alle Benutzeroberflächen geladen. */ | /* Das folgende CSS wird für alle Benutzeroberflächen geladen. */ | ||
#p-personal { | |||
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="14" width="12" viewBox="0 0 448 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2023 Fonticons, Inc.--><path d="M224 256A128 128 0 1 0 224 0a128 128 0 1 0 0 256zm-45.7 48C79.8 304 0 383.8 0 482.3C0 498.7 13.3 512 29.7 512H418.3c16.4 0 29.7-13.3 29.7-29.7C448 383.8 368.2 304 269.7 304H178.3z"/></svg>'); | |||
background-position: top right; | |||
background-repeat: no-repeat; | |||
padding-right: 20px; | |||
} | |||
#footer { | #footer { | ||
z-index: auto; | |||
height: 120px; | |||
} | } | ||
.mw-body-content img { | .mw-body-content img { | ||
max-width: 100%; | |||
height: auto; | |||
} | |||
@media screen and (min-width: 751px) { | |||
#column-navigation { | |||
width: 13em; | |||
} | |||
} | |||
@media screen and (max-width: 960px) { | |||
a#p-banner { | |||
margin-left: 0; | |||
min-width: 300px; | |||
} | |||
#p-search { | |||
padding: 0 0 0.5rem 0; | |||
width: 100%; | |||
display: flex; | |||
position: relative; | |||
top: inherit; | |||
right: inherit; | |||
} | |||
#searchInput { | |||
flex: 15em 1 1; | |||
} | |||
#searchGoButton { | |||
flex: 1.5rem 0 0; | |||
margin: 0 10px; | |||
} | |||
} | } | ||
@media screen and ( | @media screen and (max-width: 1024px) { | ||
#page-tools { | |||
display: flex; | |||
flex-wrap: wrap; | |||
line-height: 1.2rem; | |||
} | |||
} | } | ||
@media screen | @media screen { | ||
#p-search input { | |||
background-color: rgba(255,255,255,0.8); | |||
border: none; | |||
margin-right: 10px; | |||
border-radius: 10px; | |||
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="12" width="12" viewBox="0 0 512 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2023 Fonticons, Inc.--><path d="M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z"/></svg>'); | |||
background-position: 5px; | |||
background-repeat: no-repeat; | |||
padding-left: 25px; | |||
} | |||
#p-search { | |||
margin-right: -3em; | |||
} | |||
} | } | ||
#p-search .searchButton { | |||
display:none; | |||
} | } |
Aktuelle Version vom 9. Dezember 2023, 21:38 Uhr
/* Das folgende CSS wird für alle Benutzeroberflächen geladen. */ #p-personal { background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="14" width="12" viewBox="0 0 448 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2023 Fonticons, Inc.--><path d="M224 256A128 128 0 1 0 224 0a128 128 0 1 0 0 256zm-45.7 48C79.8 304 0 383.8 0 482.3C0 498.7 13.3 512 29.7 512H418.3c16.4 0 29.7-13.3 29.7-29.7C448 383.8 368.2 304 269.7 304H178.3z"/></svg>'); background-position: top right; background-repeat: no-repeat; padding-right: 20px; } #footer { z-index: auto; height: 120px; } .mw-body-content img { max-width: 100%; height: auto; } @media screen and (min-width: 751px) { #column-navigation { width: 13em; } } @media screen and (max-width: 960px) { a#p-banner { margin-left: 0; min-width: 300px; } #p-search { padding: 0 0 0.5rem 0; width: 100%; display: flex; position: relative; top: inherit; right: inherit; } #searchInput { flex: 15em 1 1; } #searchGoButton { flex: 1.5rem 0 0; margin: 0 10px; } } @media screen and (max-width: 1024px) { #page-tools { display: flex; flex-wrap: wrap; line-height: 1.2rem; } } @media screen { #p-search input { background-color: rgba(255,255,255,0.8); border: none; margin-right: 10px; border-radius: 10px; background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="12" width="12" viewBox="0 0 512 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2023 Fonticons, Inc.--><path d="M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z"/></svg>'); background-position: 5px; background-repeat: no-repeat; padding-left: 25px; } #p-search { margin-right: -3em; } } #p-search .searchButton { display:none; }