Mozilla-Leiste

2002Andreas

Zitat von BarbaraZ-

Wie kann ich dieses in den Code einbauen?

Bitte testen und die Werte für dich anpassen.

[attachment=0]Screenshot (551).png[/attachment]

CSS

@namespace url(http://www.w3.org/1999/xhtml);


@-moz-document domain("camp-firefox.de") {


#cf-mozilla-logo {
width: 0px!important;}


#cf-mozilla-logo{
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQQAAABQCAYAAAD/YAtfAAACf0lEQVR42u3aUXKDMAxF0e5/0+kKOpk0tvQkzvnu0MSYG2P4+QEAAAAAAAAAAAAAAAAAAAAqvd44dZxPjgUMjsHpYwGCAAgC8KggGGkQA0EAQRAEEARBgJ1BEAMQA0EAQRAEEISC15WNNFgdCAIIgiCA2wVBAKsDMQg8iQkT4/YkNcmeF4RVc+L1DzeOceKzJY1R14Sr+qwV5yM1CJXjPC4INwYkZZC7LjZBqN0/6DwHq4JwY0BSBrn7gnt6ENJWB0nzYXUQbhxvwhJdEAQhMgqvAElBmHjhCUJGEFL3wMojUbkXkLI0r9p1rnwOn/Rcf0oMOsY+NghdTwo6g1A9hpW3HZ3Hm7o6SAnomCDc+lWfMMFvrzbSv5sgLIlC16bYxl+8W0GY/r1SbpO+/WyCEPSLsuF++GYQujdfN6wO0q+riA++7ZgJjzFNPkEQhCFBmDYRJm9gCYIgrA9C9eTcGoO0c/qYcyMIc4NgddB34Z14WUkQBKHsf0Q/6x4WhPWvMAvC7CBMj8GE85ny2rggCIIYhM81QRCEiCBsiEF6ECpfuRcEjx0j3xYUhPNjLAhLgpC4pN8Ug3ffJ3l18IhzJgg5ry53ffekX84tF7AgDDrmpGV9xcUoCIIgCA0Xbuo97cYgJIZXEAYHoXsCVAYrZef9KU8XBCHwmKdO3I0JkBYXQTg/F2KCUPFSxY2XNFKOefsllFcDQfgu7H/9jSAIQtntTOVnSwtC54tfn4zFiNWCINRegF3nJy0IyauDk2M/bj9BEGouxO7zIwj14z9yg1EQan8lBGHG7cKtuSYIw4PQvWO8MQhTVgcTNlMBAAAAAAAAAAAAAAAAAAAAAMb4BYhMPPOlhNQ5AAAAAElFTkSuQmCC") no-repeat  !important;
margin-top:-12px!important;
margin-right:20px!important;
padding-top:40px!important;
padding-left:250px!important}


#cf-topbar-header{
height:65px!important;}


#cf-topbar{
background:#8BD2FF!important;}


}

Alles anzeigen

Sören Hentzschel

Zitat von Paenglab

Stimmt so nicht ganz. Schwarz ist #000 also kein Rot, kein Grün und kein Blau.

Du hast meinen Beitrag nicht so verstanden, wie er gemeint war. Ausnahmslos jede im Web darstellbare Farbe ist eine Mischung aus Rot, Grün und Blau. Selbst, wenn du sagst, dass alle Werte auf 0 stehen und damit keine dieser Farben reingemischt wird: es gibt keinerlei Sonderbehandlung für Schwarz. Und in diesem Sinne ist Schwarz eine Farbe wie jeder andere Farbe auch und man kann nicht sagen, dass Schwarz in irgendeiner Hinsicht anders wäre als eine andere Farbe. Für den Computer gibt es keinen Unterschied. Für den Computer gibt es nur Nullen und Einsen, in RGB repräsentiert durch Werte von jeweils 0 bis 255. Für HSL gilt nichts anderes, das ist nur eine andere Repräsentation und man kann jede Repräsentation in jede andere ganz einfach durch Mathematik konvertieren.

Am Ende lässt sich alles auf genau das Gleiche zurückführen, wobei bei Schwarz zufällig R, G und B jeweils 0 sind, aber mehr auch nicht. Es ist damit nicht weniger eine Farbe als ein knalliges Rot. Und über die Betrachtung "Schwarz ist keine Farbe" kann man sich durchaus streiten. Denn ein absolutes Schwarz kommt in der Natur sowieso so gut wie gar nicht vor und nur das könnte man in diesem Sinne als "keine Farbe" bezeichnen. Aber bei einem rgb(0, 0, 1) würde wohl trotzdem jeder ohne jeden Zweifel sagen, dass es "Schwarz" ist, weil Menschen erstens gar nicht so fein unterscheiden können, zweitens weil wir halt alle mehr als nur einen Rot-Ton, nur einen Blau-Ton und genauso mehr als nur einen Schwarz-Ton kennen.

Zitat von Paenglab

Mit einem dunklen Hochkontrast Windows theme ist es aber auch schwarz.

Ja, Hochkontrast-Themes machen lustige Dinge, zum Beispiel kehren sie Farben um, das ist richtig. Dafür ist standardmäßig schwarze Schrift eben weiß, also das ändert an der Sache nicht viel. Dann bezieht man meine Aussage statt auf die Hintergrund- auf die Textfarbe. Ich wollte darauf hinaus, dass man nicht automatisch Schwarz annehmen kann, wenn man Farbangaben weglässt.

BarbaraZ-

Hallo Andrteas,

danke, fast perfekt.
Wo muss ich ansetzen, um das Logo insgesamt etwas kleiner zu bekommen oder brauche ich nur mit den Werten spielen?
Werte ändern bringt es nicht, verzerrt nur das Bild.

2002Andreas

Zitat von BarbaraZ-

das Logo insgesamt etwas kleiner zu bekommen

~~Ich habe leider kein Bildbearbeitungsprogramm dafür, damit der Hintergrund dabei transparent bleibt.~~

2002Andreas

Bitte wieder testen:

CSS

@namespace url(http://www.w3.org/1999/xhtml);


@-moz-document domain("camp-firefox.de") {


#cf-mozilla-logo {
width: 0px!important;}


#cf-mozilla-logo{
background: url("data:image/png;base64,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") no-repeat  !important;
margin-left:-10px!important;
margin-right:-65px!important;
margin-top:-8px!important;
padding-left:210px!important}


#cf-topbar-header{
height:65px!important;}


#cf-topbar{
background:#8BD2FF!important;}


}

Alles anzeigen

[attachment=0]index.png[/attachment]

BarbaraZ-

Hallo Andreas,

so finde ich es für mich perfekt. :klasse:

[attachment=0]mozilla-logo.PNG[/attachment]

Es darf ruhig, so wie jetzt, ein wenig größer sein.

Danke für Deine Arbeit.

2002Andreas

Freut mich

Zitat von BarbaraZ-

so wie jetzt, ein wenig größer sein.

Das Original hat fast die gleiche Größe.

[attachment=0]index.png[/attachment]

PS:
Dank an aborix für das Logo :klasse:

aborix

Ja, bitte.

Das Original: https://www.camp-firefox.de/forum/styles/c…a-logo-2017.png
und die transparente Grafik sind gleich groß: 260 x 80 px

Es war nicht viel zu tun:
Ich habe beim Original der Einfachheit wegen an den Rändern zwischen schwarz und weiß die grauen Pixel durch schwarze und weiße ersetzt.
Dann habe ich den Hintergrund transparent gemacht, bei diesem Online-Bild-Editor:
https://pixlr.com/editor/ (benötigt Flash),
nach dieser Anleitung:
http://web.archive.org/web/2014082000…#reply_11264253 (Beitrag von Ella Meade)

Sören Hentzschel

Zitat von Sören Hentzschel

Ich werde die Grafik gegen eine mit transparentem Hintergrund austauschen, sobald Mozilla den aktualisierten Style Guide veröffentlicht.

WONTFIX gemäß https://mozilla.ninja/our-logo/

Zitat

The wordmark combined with the highlight make up our logo. The wordmark is not to be used without the highlight.

Es kann natürlich jeder individuell auf das Logo mit transparentem Hintergrund zurückgreifen, welches hier im Thread bereitgestellt worden ist. Standardmäßig werde ich aber den schwarzen Hintergrund lassen.