CSS-Editor-Bereinigung Version 1.0, Damit die CSS so bleibt wie erstellt Einstellungen

[Olaf]

So, hier der komplette Hack für den CSS-Editor!

Die andauernden Probleme die es immer wieder gab, das der Upload nicht klappt, das Regeln die wohlüberlegt eingefügt wurden angemeckert wurden, das es nicht möglich war Hacks einzubauen weil es die Fehlerprüfung unmöglich machte abzuspeichern, alles passe, Ende, vorbei. Der Editor gibt jetzt in der Datei das aus was hochgeladen wird, ganau in der Reihenfolge, mit Zeilenumbrüchen, Leerzeichen und allem was ihr sonst angebt.

Aber Achtung!!! Alle Kommentare werden gnadenlos entfernt!!! Wenn jemand mag, es darf sich gerne noch darüm gekümmert werden, bkm und ich sind daran gescheitert. Es ist eine kleine Vorbereitung in der Datei versteckt, näheres aber dann von mir, ihr wisst ja wo ihr mich findet.

Die Fehlerberichte und der Entwicklungsprozess ist hier nachzulesen, wenn nötig dann auch dort weiterdiskutieren, Fehler zu melden.

Ich empfehle abgebildete Einstellungen im Projekt vorzunehmen:
 Screen_Einstellungen_CSS_Editor.jpg ( 19.47KB ) Anzahl der Downloads: 215


ZIP entpacken, ins Backendverzeichnis kippen, hochladen. Die enthaltene css_edit.tpl sollte auch mit hochgeladen werden! Es ist nur eine Änderung von einem Textfeld zu Textarea gemacht, dies ist notwendig da es auch die Möglichkeit gibt das mehrzeilige Selektoren vorkommen.

 CSS_Editor_Bereinigung_v._1.0.zip ( 13.22KB ) Anzahl der Downloads: 76


Ich persönlich würde mich freuen wenn sich die Maintainer mal dazu äußern würden ob sie das übernehmen. Ich bin der Meinung, dass damit der Editor so bleiben kann wie er ist. Für die Zukunft würde ich noch anregen, eine Möglichkeit zu schaffen direkt in der physischen CSS arbeiten zu können, sprich, die Datei selbst in eine Textarea zu laden und dort zu editieren. Zu beachten wäre dabei, dass nicht nur die Datei editiert wird sondern auch die Einträge in der DB zu aktualiesieren sind. Dies könnte sich hinter dem Bleistifftsymbol in der Rechten Spalte der Übersicht verbergen, wozu das sich dort öffnende Feature da ist erschließt sich mir nicht.
Vielleicht wär das auch was für ne Thickbox

Mitgewirkt haben, bkm, summerbrother und braendle, Danke.

[mika]

Ich hab jetzt a bisserl experimentiert: Das Problem liegt vor allem im Download bereits hochgeladener CSS-Skripte. Ich habe die Kommentare aus der Grund-Datei entfernt, damit ich ein vergleichbares Ergebnis bekomme, hab anschließend die Datei hochgeladen, manche Selektoren als fehlerhaft markiert bekommen und dann wieder aus Sefrengo downgeloaded. Die erste Datei ist diejenige, die ich hochgeladen habe, die zweite diejenige, die ich downgeloaded hab:

hochgeladene:

QUELLTEXT

@media all
{
    
    
    body { min-height: none; }                                                
    html { height: auto; }  
    
    .clearfix { display: inline-block; }  

    
    * html .clearfix { height: 1%; }  
    .clearfix { display: block; }      
    
    * html .floatbox { width:100%; }
    
    * html #col1 { position:relative; }
    * html #col2 { position:relative; }
    * html #col3 { position:relative; }
    
    .hold_floats { height: 1%; }

    
    * html ul { position: relative }
    * html ol { position: relative }
    * html dl { position: relative }


    * html blockquote { zoom:1 }


    #page_margins, #page, #header, #nav, #main, #footer { zoom: 1; }


    * html #col1 { display: inline; }
    * html #col2 { display: inline; }


    * html #col1_content { overflow: visible; }
    * html #col2_content { overflow: visible; }
    * html #col3_content { overflow: visible; }
    * html i, * html em { overflow: visible; display:inline-block; }

    
    #ie_clearing {
        display:block;      
        \clear:both;          

        width: 100%;        
        font-size:0;        
        margin: -2px 0 -1em 1px;  
    }

    * html #ie_clearing { margin: 0 0 -1em 0}         
    
    html {margin-right: 1px}
    * html {margin-right: 0}

    #col3_content {margin-bottom:-2px; }
    #col3 { position:relative; }

    .c50l, .c25l, .c33l, .c38l, .c66l, .c75l, .c62l { display:inline; }
    .c50r, .c25r, .c33r, .c38r, .c66r, .c75r, .c62r { display:inline; }

    .subc, .subcl, .subcr { width:auto; zoom: 1; }
    .subc, .subcl, .subcr { width:100%; w\idth: auto; }
}

@media screen
{


    * html #col1_content { word-wrap: break-word; }
    * html #col2_content { word-wrap: break-word; }
    * html #col3_content { word-wrap: break-word; }
    

    * html a,
    * html a:hover { background-color: transparent; }
    * html #footer a,
    * html #footer a:hover { background-color: transparent; }
    
    
}

downgeloadede Datei!!!:

QUELLTEXT

@import url(body);
html {
height: auto;
}
.clearfix {
display: inline-block;
}
* html .clearfix {
height: 1%;
}
.clearfix {
display: block;
}
* html .floatbox {
width:100%;
}
* html #col1 {
position:relative;
}
* html #col2 {
position:relative;
}
* html #col3 {
position:relative;
}
.hold_floats {
height: 1%;
}
* html ul {
position: relative
}
* html ol {
position: relative
}
* html dl {
position: relative
}
* html blockquote {
zoom:1
}
#page_margins, #page, #header, #nav, #main, #footer {
zoom: 1;
}
* html #col1 {
display: inline;
}
* html #col2 {
display: inline;
}
* html #col1_content {
overflow: visible;
}
* html #col2_content {
overflow: visible;
}
* html #col3_content {
overflow: visible;
}
* html i, * html em {
overflow: visible;display:inline-block;
}
#ie_clearing {
display:block;
\clear:both;

width: 100%;
font-size:0;
margin: -2px 0 -1em 1px;
}
* html #ie_clearing {
margin: 0 0 -1em 0
}
html {
margin-right: 1px
}
* html {
margin-right: 0
}
#col3_content {
margin-bottom:-2px;
}
#col3 {
position:relative;
}
.c50l, .c25l, .c33l, .c38l, .c66l, .c75l, .c62l {
display:inline;
}
.c50r, .c25r, .c33r, .c38r, .c66r, .c75r, .c62r {
display:inline;
}
.subc, .subcl, .subcr {
width:auto;zoom: 1;
}
.subc, .subcl, .subcr {
width:100%;w\idth: auto;
}
@import url(* html #col1_content);
* html #col2_content {
word-wrap: break-word;
}
* html #col3_content {
word-wrap: break-word;
}
* html a,
* html a:hover {
background-color: transparent;
}
* html #footer a,
* html #footer a:hover {
background-color: transparent;
}

Was auffällt: Die @...-deklarationen werden vollständig durch @import(url...) ersetzt!?

Mir kommts ja fast so vor, als ob ich den hack gar nicht eingespielt hätte, aber ich habs gemacht und auch die Einstellungen im Projekt - ich verstehs nicht.

Was auch total komisch ist, ist die Tatsache, dass beim Hochladen in Design > Css was ganz anderes angzeigt wird, als dass dann als CSS eingebunden wird:

 Sefrengo_iehacks_ohne_kommentare.png ( 81.27KB ) Anzahl der Downloads: 17


in der Seite hab ich dann das CSS über die FF-Web-Developer-Bar ausgelesen und das CSS stimmt mit dem überein, was dann downgeloaded wird (siehe oben).

Ich hab jetzt grade keinen ftp-Zugang, aber heute abend kontrolliere ich noch mal die dateien aus deinem Hack Olaf.

Ansonsten hab ich dann keine Ahnung mehr, was da passiert ??? ratlos

Der Beitrag wurde von mika bearbeitet: Tue. 19. December 2006, 13:01