Logo für Editorhintergrund anpassen?

  • Ich nutze bereits schon lange ein Logo, welches ich unten rechts im Editor anzeigen lasse. Schreibt man etwas mehr Text, landet der Text unweigerlich über dem Logo. Bisher war das auch nicht so das große Problem, weil der Editor Hintergrund immer hell und die Schrift dunkel war.


    graphit.png


    Klar, der Text war bereits etwas schlecht zu lesen, aber es ging immer noch. Nun nutze ich allerdings auch einen dunklen Stil (Base Dark), bei dem der Editor einen dunklen Hintergrund hat. Die Schriftfarbe ist grau und nun ist der Text viel schlechter zu erennen.


    dark.png



    Das Logo, welches ich bisher genutzt habe, ist dieses:


    cw_logo_editor.png


    Ich hätte gern dieses Logo als Hintergrund im Editor.


    CompiWare_Icon.png


    Von der Größe her sollte das neue Hintergrundlogo so sein, wie mein bisheriges Logo. Und von der Farbgestaltung soll es eben sowohl in den dunklen als auch den hellen Editorhintergund passen, so dass die Schrift, die darüber liegt, auch noch gut zu erkennen ist.


    Im Woltlab Forum wurde mir geraten, das ganze Logo etwas transparenter zu gestalten. Doch ich breche mir mit Paint.Net gerade die Finger und bekomme nichts Brauchbares hin. :(
    Könnte mir vielleicht jemand von euch dabei behilflich sein?

    • Teambeitrag

    Warum nimmst du denn nicht weiterhin das alte Bild bei den hellen Stilen? Das finde ich passender als da noch mal Farbe zu verwenden.

    • Teambeitrag

    Nicht getestet aber ich denke:


    CSS
    .redactor-layer {
    	background-image: url('#{$style_image_path}logo.png');
    	background-position: right bottom;
    }
  • Jetzt erst wieder Zeit gehabt, nachzuschauen... :)


    Warum nimmst du denn nicht weiterhin das alte Bild bei den hellen Stilen?

    Wollte schon gern ein einheitliches Logo für alle Stile haben. Und aktuell nutze ich ein blaues Logo mit 80% Transparenz. Das passt ganz gut, denke ich... :)



    wie binde ich denn überhaupt das Logo dort ein?

    Bei mir klappt das folgendermaßen:


    CSS
    .redactor-layer {
    	background: url("#{$style_image_path}logo.png") no-repeat scroll right bottom transparent !important;
    }

    Bei mir muss das Logo dann in jedem Stil-Ordner liegen. :)