Benutzer Diskussion:Pechvogel/vector.css: Unterschied zwischen den Versionen
imported>Pechvogel (Die Seite wurde neu angelegt: „[http://en.wikipedia.org/wiki/Help:User_Style] Hab da was kopiert, das funzt hier aber nicht. Kann mir jemand helfen? Nur die runden Ecken funktionieren. --~~~~“) |
Ryuka (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
||
(9 dazwischenliegende Versionen von 2 Benutzern werden nicht angezeigt) | |||
Zeile 1: | Zeile 1: | ||
[http://en.wikipedia.org/wiki/Help:User_Style] Hab da was kopiert, das funzt hier aber nicht. Kann mir jemand helfen? Nur die runden Ecken funktionieren. --[[datei:Benutzer_Pechvogel-Signatur.png|link=Benutzer:Pechvogel]] 09:12, 11. Sep. 2016 (CEST) | [http://en.wikipedia.org/wiki/Help:User_Style] Hab da was kopiert, das funzt hier aber nicht. Kann mir jemand helfen? Nur die runden Ecken funktionieren. --[[datei:Benutzer_Pechvogel-Signatur.png|link=Benutzer:Pechvogel]] 09:12, 11. Sep. 2016 (CEST) | ||
:Versuch es mal mit der !important[[http://www.css-hack.de/CSS+allgemein/!+important]] Eigenschaft, damit kannste Bestehendes überschreiben. Dein Bildpfad muss übrigends der hier sein http://www.guildwiki.de/gwiki/images/d/d2/Benutzer_Pechvogel-Tux.png --[[Datei:Benutzer_Ryuka-Signatur-groß.png|link=Benutzer:Ryuka|x18px]] 13:31, 11. Sep. 2016 (CEST) | |||
::So? Geht trotzdem nicht. Liegts am Mediawiki? --[[datei:Benutzer_Pechvogel-Signatur.png|link=Benutzer:Pechvogel]] 15:36, 11. Sep. 2016 (CEST) | |||
<pre> | |||
/* Logo ändern */ | |||
#p-logo a { | |||
background: url(http://www.guildwiki.de/gwiki/images/d/d2/Benutzer_Pechvogel-Tux.png) 35% 50% no-repeat !important; | |||
} | |||
</pre>funktioniert bei mir --[[Datei:Benutzer_Ryuka-Signatur-groß.png|link=Benutzer:Ryuka|x18px]] 22:29, 11. Sep. 2016 (CEST) | |||
:Yippee! Jetzt hab ich nur noch 2 Probleme: <br> *Die Suche soll wie bei Monobook links rein, bei Google gibst nur die Adminvariante <br> *Die Box links soll mitscrollen, das gebt anscheinend nur mit Plugins <br> Danke für die Hilfe! --[[datei:Benutzer_Pechvogel-Signatur.png|link=Benutzer:Pechvogel]] 10:01, 12. Sep. 2016 (CEST) | |||
Du bist ja wahrscheinlich noch nicht weiter gekommen, daher hier mal ein bisschen Code {{smiley|:)}}.<br /> | |||
Das Scrollen lässt sich leicht verhindern.<br /> | |||
'''vector.css''' | |||
<pre> | |||
/* Linke Seite fixiert */ | |||
#mw-panel { | |||
position: fixed !important; | |||
} | |||
</pre> | |||
Die Suchbox kannst du zur Not mit nem Javascript verschieben.<br /> | |||
'''vector.js''' | |||
<pre> | |||
var panel = document.getElementById("mw-panel"); | |||
var navigation = document.getElementById("p-navigation"); | |||
var search = document.getElementById("p-search"); | |||
var form = document.getElementById("searchform"); | |||
var newWrapper = document.createElement("div"); | |||
newWrapper.className = "body"; | |||
newWrapper.appendChild(form); | |||
search.className = "portal"; | |||
search.appendChild(newWrapper); | |||
panel.insertBefore(search, navigation); | |||
</pre> | |||
Durch weitere kleine Anpassungen siehts dann auch noch schöner aus.<br /> | |||
'''vector.css''' | |||
<pre> | |||
/* Suchbox verschönern /* | |||
#p-search { | |||
margin: 0 !important; | |||
float: none !important; | |||
} | |||
#p-search h5 { | |||
display: block !important; | |||
} | |||
#searchform { | |||
margin: 0 !important; | |||
text-align: center !important; | |||
} | |||
#searchInput { | |||
width: 90% !important; | |||
} | |||
</pre> | |||
--[[Datei:Benutzer_Ryuka-Signatur-groß.png|link=Benutzer:Ryuka|x18px]] 13:30, 13. Sep. 2016 (CEST) | |||
:Danke! Super, dass du das für mich machst! Das JavaScript geht nicht, aber der Rest schon. (Hurra!) MAche ich was falsch? --[[datei:Benutzer_Pechvogel-Signatur.png|link=Benutzer:Pechvogel]] 18:39, 13. Sep. 2016 (CEST) | |||
Ja, habe mich bei dem JavaScript vertan (auch auf meiner Seite). Man muss eine sogenannte Hook einbauen, was zwar veraltet ist, aber genutzt werden muss, da hier kein jquery installiert ist, damit man mit dem js die vorhandenen Elemente manipulieren kann (geht ja schlecht wenn sie noch nicht da sind). Mit der wird dann mit dem Funktionsaufruf gewartet bis die Seite vollstädnig geladen ist. Führt bei größeren Funktionen aber zu Leistungseinbrüchen. Das ganze sieht dann so aus: | |||
'''vector.js''' | |||
<pre> | |||
addOnloadHook(function() { | |||
var panel = document.getElementById("mw-panel"); | |||
var navigation = document.getElementById("p-navigation"); | |||
var search = document.getElementById("p-search"); | |||
var form = document.getElementById("searchform"); | |||
var newWrapper = document.createElement("div"); | |||
newWrapper.className = "body"; | |||
newWrapper.appendChild(form); | |||
search.className = "portal"; | |||
search.appendChild(newWrapper); | |||
panel.insertBefore(search, navigation); | |||
}); | |||
</pre> | |||
--[[Datei:Benutzer_Ryuka-Signatur-groß.png|link=Benutzer:Ryuka|x18px]] 08:32, 14. Sep. 2016 (CEST) | |||
Danke! Alles ist perfekt! --[[datei:Benutzer_Pechvogel-Signatur.png|link=Benutzer:Pechvogel]] 16:23, 14. Sep. 2016 (CEST) | |||
::Kein Thema, wenn du wieder Hilfe brauchst, versuch ich mich mal einzuschalten. --[[Datei:Benutzer_Ryuka-Signatur-groß.png|link=Benutzer:Ryuka|x18px]] 08:14, 15. Sep. 2016 (CEST) |
Aktuelle Version vom 15. September 2016, 07:14 Uhr
[1] Hab da was kopiert, das funzt hier aber nicht. Kann mir jemand helfen? Nur die runden Ecken funktionieren. -- 09:12, 11. Sep. 2016 (CEST)
- Versuch es mal mit der !important[[2]] Eigenschaft, damit kannste Bestehendes überschreiben. Dein Bildpfad muss übrigends der hier sein http://www.guildwiki.de/gwiki/images/d/d2/Benutzer_Pechvogel-Tux.png -- 13:31, 11. Sep. 2016 (CEST)
/* Logo ändern */ #p-logo a { background: url(http://www.guildwiki.de/gwiki/images/d/d2/Benutzer_Pechvogel-Tux.png) 35% 50% no-repeat !important; }
funktioniert bei mir -- 22:29, 11. Sep. 2016 (CEST)
- Yippee! Jetzt hab ich nur noch 2 Probleme:
*Die Suche soll wie bei Monobook links rein, bei Google gibst nur die Adminvariante
*Die Box links soll mitscrollen, das gebt anscheinend nur mit Plugins
Danke für die Hilfe! -- 10:01, 12. Sep. 2016 (CEST)
Du bist ja wahrscheinlich noch nicht weiter gekommen, daher hier mal ein bisschen Code .
Das Scrollen lässt sich leicht verhindern.
vector.css
/* Linke Seite fixiert */ #mw-panel { position: fixed !important; }
Die Suchbox kannst du zur Not mit nem Javascript verschieben.
vector.js
var panel = document.getElementById("mw-panel"); var navigation = document.getElementById("p-navigation"); var search = document.getElementById("p-search"); var form = document.getElementById("searchform"); var newWrapper = document.createElement("div"); newWrapper.className = "body"; newWrapper.appendChild(form); search.className = "portal"; search.appendChild(newWrapper); panel.insertBefore(search, navigation);
Durch weitere kleine Anpassungen siehts dann auch noch schöner aus.
vector.css
/* Suchbox verschönern /* #p-search { margin: 0 !important; float: none !important; } #p-search h5 { display: block !important; } #searchform { margin: 0 !important; text-align: center !important; } #searchInput { width: 90% !important; }
-- 13:30, 13. Sep. 2016 (CEST)
- Danke! Super, dass du das für mich machst! Das JavaScript geht nicht, aber der Rest schon. (Hurra!) MAche ich was falsch? -- 18:39, 13. Sep. 2016 (CEST)
Ja, habe mich bei dem JavaScript vertan (auch auf meiner Seite). Man muss eine sogenannte Hook einbauen, was zwar veraltet ist, aber genutzt werden muss, da hier kein jquery installiert ist, damit man mit dem js die vorhandenen Elemente manipulieren kann (geht ja schlecht wenn sie noch nicht da sind). Mit der wird dann mit dem Funktionsaufruf gewartet bis die Seite vollstädnig geladen ist. Führt bei größeren Funktionen aber zu Leistungseinbrüchen. Das ganze sieht dann so aus: vector.js
addOnloadHook(function() { var panel = document.getElementById("mw-panel"); var navigation = document.getElementById("p-navigation"); var search = document.getElementById("p-search"); var form = document.getElementById("searchform"); var newWrapper = document.createElement("div"); newWrapper.className = "body"; newWrapper.appendChild(form); search.className = "portal"; search.appendChild(newWrapper); panel.insertBefore(search, navigation); });