News (06 Aug 2024): Das Wiki läuft jetzt auf einem neuen Server. Aufgrund eines Upgrades von PHP mussten die Wiki-Software und die DPL-Erweiterung aktualisiert werden. Bitte meldet Fehler auf der Hauptseiten-Diskussion.

Benutzer Diskussion:Pechvogel/vector.css: Unterschied zwischen den Versionen

Aus GuildWiki
Zur Navigation springenZur Suche springen
Keine Bearbeitungszusammenfassung
Keine Bearbeitungszusammenfassung
 
(7 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)
: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. --Benutzer Pechvogel-Signatur.png 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 --Benutzer Ryuka-Signatur-groß.png 13:31, 11. Sep. 2016 (CEST)
So? Geht trotzdem nicht. Liegts am Mediawiki? --Benutzer Pechvogel-Signatur.png 15:36, 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 --Benutzer Ryuka-Signatur-groß.png 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! --Benutzer Pechvogel-Signatur.png 10:01, 12. Sep. 2016 (CEST)

Du bist ja wahrscheinlich noch nicht weiter gekommen, daher hier mal ein bisschen Code lächelnd/glücklich.
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;
}

--Benutzer Ryuka-Signatur-groß.png 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? --Benutzer Pechvogel-Signatur.png 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);
});

--Benutzer Ryuka-Signatur-groß.png 08:32, 14. Sep. 2016 (CEST)

Danke! Alles ist perfekt! --Benutzer Pechvogel-Signatur.png 16:23, 14. Sep. 2016 (CEST)

Kein Thema, wenn du wieder Hilfe brauchst, versuch ich mich mal einzuschalten. --Benutzer Ryuka-Signatur-groß.png 08:14, 15. Sep. 2016 (CEST)