Beiträge von Mr. Cutty

Mr. Cutty

Ruft man "Seite durchsuchen" auf, erscheint am unteren Browserrand die Suchleiste (Findbar) und der Standard Status-Panel erscheint dann darüber, wenn man anschließend über einen Link fährt.

Hat man nun einen angepassten Status-Panel, ...

CSS

/* ------------------------------------ */
/* Status-Panel / Helles Standard-Theme */
/* ------------------------------------ */

#statuspanel {
background-color: #F5F6F7 !important;
border: none !important;
bottom: 8px !important;
height: 22px !important;
max-width: 80% !important;
box-shadow: 0px 0px 4px 0px #353535 !important;
background: #F5F6F7 !important;
transition: none !important;
}

#statuspanel-label {
border: none !important;
background: transparent !important;
padding-top: 3px !important;
margin-left: 16px !important;
margin-right: 16px !important;
padding-bottom: 20px !important;
font-size: 11px !important;
color: #000000 !important;
}

Alles anzeigen

... bleibt der Status-Panel da wo er ist, also auf der Findbar.

Gibt es da einen Trick, dass der angepasste Status-Panel nach dem Aufruf der Findbar auch dann oberhalb der Findbar erscheint, wenn man mit der Maus über einen Link drüberfährt?

Mr. Cutty

Zitat von 2002Andreas
Teste bitte:
CSS
.urlbarView-body-inner {
  border-top: 1px solid red !important;
  }

Super. Danke.

Mr. Cutty

Kann man den Strich, der die Urls und die darunter erscheinenden Adressvorschläge trennt, eine andere Farbe geben?

Ist es möglich, dass der Strich nicht mit scrollt sondern stehen bleibt wenn man die Adressenauflistung durchscrollt?

Mr. Cutty

Wenn ich weder was eintippe noch in die Urlbar reinklicke, kommt gar nichts.

Erst wenn ich was zu tippen anfange (oder reinklicke), kommen Vorschläge von vorher besuchten Seiten und da kommen eben diese 80 eingestellten Urls (about:config -> browser.urlbar.maxRichResults) die ich dann auch in der Adressenauflistung durchscrollen kann.

Mr. Cutty

Ich hatte das mal von hier als Tipp für die Anpassungen übernommen, was so aber nun nicht mehr nötig ist. Es hat halt bisher so funktioniert.

Mittlerweile ist mein CSS-Code in der userChrome.css, dank der Hilfe hier aus dem Forum, dafür eh komplett anders:

CSS

/* -------------------------------------------------------- */
/* Anpassungen der Urlbar und Liste mit Adressenvorschlägen */
/* -------------------------------------------------------- */

/* Maximale Höhe der Adressenauflistung */

.urlbarView {
height: 500px !important;
max-height: 500px !important;
}

/* Abstand oben und unten in der Adressenauflistung */

#urlbar-results {
margin-top: 1px !important;
margin-bottom: 3px !important;
}

/* Scrollbar und Position der Adressenauflistung */

.urlbarView {
overflow-y: scroll !important;
margin-top: -1px !important;
margin-bottom: 1px !important;
}

/* Vergrößerung der Urlbar deaktivieren */

#urlbar[breakout][breakout-extend] {
top: calc((var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2) !important;
left: 0 !important;
width: 100% !important;
}

#urlbar[breakout][breakout-extend] > #urlbar-input-container {
height: var(--urlbar-height) !important;
padding-block: 0 !important;
padding-inline: 0 !important;
}

#urlbar[breakout][breakout-extend][breakout-extend-animate] > #urlbar-background {
animation-name: none !important;
}

#urlbar[breakout][breakout-extend] > #urlbar-background {
box-shadow: none !important;
}

#urlbar[breakout][breakout-extend][open] > #urlbar-background {
box-shadow: 2px 2px 2px #787878 !important;
}

Alles anzeigen

Und sieht so aus:

Mr. Cutty

milupo

Danke für die Aufklärung. Habe es so gemacht wie Du geschrieben hast.

Mr. Cutty

Danke. Das hilft mir schon mal weiter.

Ich sehe gerade das bei langen Urls dieser Pfeil quasi fast verschwindet. Dann lasse ich ihn doch lieber weg.

Mr. Cutty

Lasse ich das alles mit .megabar weg, ist die Urlbar mit Adressenauflistung bei mir kaputt, sieht nicht mehr so aus wie vorher bzw. wie gewollt.

Mr. Cutty

Hast ja eigentlich recht. Das sind halt diese Gewohnheiten. Ich habe immer auf den Pfeil geklickt, obwohl eben das hineinklicken in die Urlbar das selbe macht.

Mr. Cutty

Danke. Funktioniert.

Hast Du hierfür auch noch einen Tipp?

Zitat von Mr. Cutty
Dann fehlt wieder der dauerhafte Auswahlpfeil in der Urlbar den ich gerne wieder haben möchte. Mein CSS-Code bisher:
Code
/* ---------------------------------------------- */
/* Auswahlpfeil in Adresszeile dauerhaft anzeigen */
/* ---------------------------------------------- */

@-moz-document url(chrome://browser/content/browser.xhtml) {
.urlbar-history-dropmarker {opacity: 1 !important}

Mr. Cutty

Damit hatte ich auch schon rumgespielt, nur eben sieht es ja dann so aus (mit Deinem Beispiel) wenn man den FF startet oder einen neuen Tab öffnet.

Es soll aber erst der Schatten kommen wenn man in die Urlbar reinklickt oder was reintippt und die Adressenvorschläge darunter kommen.

Mr. Cutty

cartridge_case

Ich habe ein wenig rumprobiert und habe meinen Quelltext für die Urlbar mit Adressenauflistung angepasst.

Siehe auch hier: Schatteneffekt um Urlbar mit Adressenauflistung + Auswahlpfeil in Adresszeile dauerhaft anzeigen

Mr. Cutty

Wie bekomme ich im FF 77 um die Urlbar mit Adressenauflistung einen Schatteneffekt? Dieser soll erst einscheinen wenn man die Urlbar anklickt btw. was reintippt.

Also so wie beim Suchfeld:

Mein CSS-Code bisher:

CSS

/* -------------------------------------------------------- */
/* Anpassungen der Urlbar und Liste mit Adressenvorschlägen */
/* -------------------------------------------------------- */

:root {
/* Wert muss identisch in about:config = browser.urlbar.maxRichResults sein */

--ac_popup_number_of_results: 80;

/* Je höher der Wert oben, je kleiner muss der px Wert sein */

--ac_popup_maxheight: calc(6px * ( var(--ac_popup_number_of_results) + 1 ));
--ac_popup_height: calc(400px * var(--ac_popup_number_of_results));
}

/* Maximale Einträge die ohne zu scrollen angezeigt werden */

.urlbarView:not(.megabar) {
height: var(--ac_popup_height) !important;
max-height: var(--ac_popup_maxheight) !important;
}

/* Abstand oben und unten in der Adressenauflistung */

#urlbar-results {
margin-top: 1px !important;
margin-bottom: 3px !important;
}

/* Scrollbar und Position der Adressenauflistung */

.urlbarView:not(.megabar){
overflow-y: scroll !important;
margin-top: -1px !important;
margin-bottom: 1px !important;
}

/* Vergrößerung der Urlbar deaktivieren */

#urlbar[breakout][breakout-extend] {
top: calc((var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2) !important;
left: 0 !important;
width: 100% !important;
}

#urlbar[breakout][breakout-extend] > #urlbar-input-container {
height: var(--urlbar-height) !important;
padding-block: 0 !important;
padding-inline: 0 !important;
}

#urlbar[breakout][breakout-extend][breakout-extend-animate] > #urlbar-background {
animation-name: none !important;
}

#urlbar[breakout][breakout-extend] > #urlbar-background {
box-shadow: none !important;
}

Alles anzeigen

Dann fehlt wieder der dauerhafte Auswahlpfeil in der Urlbar den ich gerne wieder haben möchte. Mein CSS-Code bisher:

Code

/* ---------------------------------------------- */
/* Auswahlpfeil in Adresszeile dauerhaft anzeigen */
/* ---------------------------------------------- */

@-moz-document url(chrome://browser/content/browser.xhtml) {
.urlbar-history-dropmarker {opacity: 1 !important}
}

Danke.

Mr. Cutty

Im FF 77 gibt es ja final die neue Urlbar. Durch den obigen CSS-Code habe ich die Vergrößerung schon abgestellt. Kann man die neue Url-Bar abschalten und wieder so aussehen lassen wie bis FF 76?

Ich habe ja eine angepasste Urlbar mit Url-Auflistung und die ist nun in der neuen Urlbar quasi etwas unpassend eingebettet. Mein CSS-Code bisher:

CSS

/* ---------------------------------------------------------------- */
/* Anzeige einer Scrollleiste für Adressvorschläge unter der Urlbar */
/* ---------------------------------------------------------------- */

:root {
/* Wert muss identisch in about:config = browser.urlbar.maxRichResults sein */

--ac_popup_number_of_results: 80;

/* Je höher der Wert oben, je kleiner muss der px Wert sein */

--ac_popup_maxheight: calc(6px * ( var(--ac_popup_number_of_results) + 1 ));
--ac_popup_height: calc(400px * var(--ac_popup_number_of_results));
}

/* Maximale Einträge die ohne zu scrollen angezeigt werden */

.urlbarView:not(.megabar) {
height: var(--ac_popup_height) !important;
max-height: var(--ac_popup_maxheight) !important;
}

/* Scrollbar wird bei Bedarf angezeigt */

.urlbarView:not(.megabar){
overflow-y: scroll !important;
}

/* Popupfenster schmaler, oder diesen Teil vom Code entfernen bzw. auskommentieren */

.urlbarView:not(.megabar) {
background-color: #FFFFFF !important;
max-width: 1000px !important;
margin-top: 0px !important;
margin-left: 74px !important;
border: 1px solid #0078D7 !important;
box-shadow: 2px 2px 2px #787878 !important;
}

/* Popup nach links verschoben */

#urlbar-results {
margin-left: 51px !important;
}

/* Breite der Url */

.urlbarView-url {
overflow: visible !important;
}

/* Gesamtes Textfeld nach links an den Rand */

.urlbarView-row-inner {
margin-left: -100px !important;
}

Alles anzeigen

Dann fehlt mir in der Urlbar wieder der dauerhafte Auswahlpfeil. Mein CSS-Code bisher:

Code

/* ---------------------------------------------- */
/* Auswahlpfeil in Adresszeile dauerhaft anzeigen */
/* ---------------------------------------------- */


@-moz-document url(chrome://browser/content/browser.xhtml) {
.urlbar-history-dropmarker {opacity: 1 !important}
}

Mr. Cutty

RE: Statusleiste

Mr. Cutty

Zitat von 2002Andreas

Zitat von Mr. Cutty

wo ich was rotes haben soll?

Das habe ich nur gemacht, damit man es besser erkennen kann.

Zitat von Mr. Cutty

In der "statusleiste.uc,js" dies:

Das erklärt natürlich alles, siehe meinen Nachtrag in Beitrag 346.
Du nutzt dann wohl das alte und das neue Script gleichzeitig, das kann natürlich keiner ahnen.
In deinem Script hat die Leiste nämlich den Namen statusleiste, in meinem aber new-toolbar.

Alles anzeigen

Und darum habe ich es umbenannt bevor ich es bei mir eingepflegt habe. Siehe oben.

Mr. Cutty

Und mache ich aus meinem CSS-Code das #statusleiste weg, sieht es so aus:

Und ich weiß nicht wo ich was rotes haben soll?

in der "userChrome.css" steht das:

CSS

/* ------------------------------------ */
/* Statusleiste / Helles Standard-Theme */
/* ------------------------------------ */

#statusleiste {
height: 24px !important;
direction: rtl !important;
background: #F5F6F7 !important;
border-top: 1px solid #CCCCCC !important;
}

#statuspanel {
background-color: transparent !important;
border: none !important;
bottom: 14px !important;
height: 24px !important;
max-width: 100% !important;
transition: none !important;
}

#statuspanel-label {
border:none !important;
background:transparent !important;
padding-top: 3px !important;
padding-left: 6px !important;
color: #000000 !important;
}

Alles anzeigen

In der "statusleiste.uc.js" dies:

Code

/* ------------ */
/* Statusleiste */
/* ------------ */

(function() {

if (location != 'chrome://browser/content/browser.xhtml')
return;

var tb = document.createXULElement('toolbar');
tb.id = 'statusleiste';
tb.setAttribute('customizable', true);
tb.setAttribute('mode', 'icons');

var vbox = document.createXULElement('vbox');
document.getElementById('navigator-toolbox').parentNode.parentNode.insertBefore(
vbox, document.getElementById('browser-bottombox'));
vbox.style.backgroundColor = 'lightgrey';
vbox.appendChild(tb);

CustomizableUI.registerArea('statusleiste', {legacy: true});
CustomizableUI.registerToolbarNode(tb);

})();

Alles anzeigen

Neben den anderen benötigten Dateien in anderen Verzeichnissen.

Und dann sieht das so aus wie es gewollt ist:

Mr. Cutty

Zitat von 2002Andreas

Kann ich mir zwar nicht vorstellen, denn wie gesagt gibt es die Bezeichnung #statusleiste nicht mehr.
Aber du kannst den Teil vom Code eh drin lassen, kaputt kann er nichts machen.
Wie du erkennen kannst, der Hintergrund ist nicht rot:

Würde ich den ganzen CSS-Code weglassen, würde es bei mir dann so ausschauen:

Würde ich Teile davon weglassen, würde es auch anders aussehen.

Mr. Cutty

Mache ich das weg, sieht es aber nicht mehr so aus wie gewollt, wie im geposteten Screenshot.

Mr. Cutty

Ersetze ich "new-toolbar" durch "Statusleiste" passt das wieder und natürlich hat der CSS-Code eine Funktion. Sonst würde die anders aussehen als so:

Beiträge von Mr. Cutty

Angepasster Status-Panel soll nach Aufruf der Findbar darüber erscheinen

Trennstrich von Urlbar und Adressenauflistung eine andere Farbe geben + Trennstrich beim scrollen nicht mitscrollen

Trennstrich von Urlbar und Adressenauflistung eine andere Farbe geben + Trennstrich beim scrollen nicht mitscrollen

URL/Adressleistengröße anpassen

URL/Adressleistengröße anpassen

URL/Adressleistengröße anpassen

Schatteneffekt um Urlbar mit Adressenauflistung + Auswahlpfeil in Adresszeile dauerhaft anzeigen

URL/Adressleistengröße anpassen

Schatteneffekt um Urlbar mit Adressenauflistung + Auswahlpfeil in Adresszeile dauerhaft anzeigen

Schatteneffekt um Urlbar mit Adressenauflistung + Auswahlpfeil in Adresszeile dauerhaft anzeigen

Schatteneffekt um Urlbar mit Adressenauflistung + Auswahlpfeil in Adresszeile dauerhaft anzeigen

URL/Adressleistengröße anpassen

Schatteneffekt um Urlbar mit Adressenauflistung + Auswahlpfeil in Adresszeile dauerhaft anzeigen

URL/Adressleistengröße anpassen

Statusleiste

Statusleiste

Statusleiste

Statusleiste

Statusleiste

Statusleiste